support/crate-report-form: Add vulnerability reporting help text

Author: Turbo87

app/components/support/crate-report-form.css

@@ -62,6 +62,22 @@
   }
 }
 
+.vulnerability-report {
+    padding: var(--space-s) var(--space-s);
+    background-color: light-dark(white, #141413);
+    border: 1px solid var(--gray-border);
+    border-radius: var(--space-3xs);
+    width: 100%;
+
+    :first-child {
+        margin-top: 0;
+    }
+
+    :last-child {
+        margin-bottom: 0;
+    }
+}
+
 .buttons {
   position: relative;
   margin: var(--space-m) 0;

app/components/support/crate-report-form.gjs

@@ -2,6 +2,7 @@ import { Input, Textarea } from '@ember/component';
 import { fn, uniqueId } from '@ember/helper';
 import { on } from '@ember/modifier';
 import { action } from '@ember/object';
+import { LinkTo } from '@ember/routing';
 import { service } from '@ember/service';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
@@ -29,7 +30,7 @@ const REASONS = [
   },
   {
     reason: 'vulnerability',
-    description: 'it contains a vulnerability (please try to contact the crate author first)',
+    description: 'it contains a vulnerability',
   },
   {
     reason: 'other',
@@ -84,6 +85,10 @@ export default class CrateReportForm extends Component {
     return this.selectedReasons.includes('malicious-code');
   }
 
+  get isVulnerabilityReport() {
+    return this.selectedReasons.includes('vulnerability');
+  }
+
   @action
   submit() {
     if (!this.validate()) {
@@ -182,6 +187,20 @@ ${this.detail}
         {{/if}}
       </fieldset>
 
+      {{#if this.isVulnerabilityReport}}
+        <div class='vulnerability-report form-group' data-test-id='vulnerability-report'>
+          <h3>🔍 Vulnerability Report</h3>
+          <p>For crate vulnerabilities, please consider:</p>
+          <ul>
+            <li>Contacting the crate author first when possible</li>
+            <li>Reporting to the
+              <a href='https://rustsec.org/contributing.html' target='_blank' rel='noopener noreferrer'>RustSec Advisory
+                Database</a></li>
+            <li>Reviewing our <LinkTo @route='policies.security' target='_blank'>security policy</LinkTo></li>
+          </ul>
+        </div>
+      {{/if}}
+
       <fieldset class='form-group' data-test-id='fieldset-detail'>
         {{#let (uniqueId) as |id|}}
           <label for={{id}} class='form-group-name'>Detail</label>

e2e/acceptance/support.spec.ts

@@ -133,7 +133,7 @@ test.describe('Acceptance | support page', { tag: '@acceptance' }, () => {
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [ ] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -178,7 +178,7 @@ Additional details:
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [x] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -257,7 +257,7 @@ test detail
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [ ] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -298,7 +298,7 @@ Additional details:
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [x] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -344,7 +344,7 @@ test detail
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [x] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [ ] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -359,4 +359,20 @@ test detail
     await page.waitForFunction(expect => globalThis.openKwargs.url === expect, mailto);
     await page.waitForFunction(expect => globalThis.openKwargs.target === expect, '_self');
   });
+
+  test('shows help text for vulnerability reports', async ({ page }) => {
+    await page.goto('/support');
+    await page.getByTestId('link-crate-violation').click();
+    await expect(page).toHaveURL('/support?inquire=crate-violation');
+
+    const crateInput = page.getByTestId('crate-input');
+    await crateInput.fill('nanomsg');
+    await expect(crateInput).toHaveValue('nanomsg');
+    await expect(page.getByTestId('vulnerability-report')).not.toBeVisible();
+
+    const checkbox = page.getByTestId('vulnerability-checkbox');
+    await checkbox.check();
+    await expect(checkbox).toBeChecked();
+    await expect(page.getByTestId('vulnerability-report')).toBeVisible();
+  });
 });

tests/acceptance/support-test.js

@@ -145,7 +145,7 @@ module('Acceptance | support', function (hooks) {
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [ ] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -183,7 +183,7 @@ Additional details:
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [x] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -284,7 +284,7 @@ test detail
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [ ] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -320,7 +320,7 @@ Additional details:
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [ ] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [x] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -359,7 +359,7 @@ test detail
 - [ ] it is name-squatting (reserving a crate name without content)
 - [ ] it is abusive or otherwise harmful
 - [x] it contains malicious code
-- [ ] it contains a vulnerability (please try to contact the crate author first)
+- [ ] it contains a vulnerability
 - [ ] it is violating the usage policy in some other way (please specify below)
 
 Additional details:
@@ -373,4 +373,18 @@ test detail
     assert.strictEqual(window.openKwargs.url, mailto);
     assert.strictEqual(window.openKwargs.target, '_self');
   });
+
+  test('shows help text for vulnerability reports', async function (assert) {
+    await visit('/support');
+    await click('[data-test-id="link-crate-violation"]');
+    assert.strictEqual(currentURL(), '/support?inquire=crate-violation');
+
+    await fillIn('[data-test-id="crate-input"]', 'nanomsg');
+    assert.dom('[data-test-id="crate-input"]').hasValue('nanomsg');
+    assert.dom('[data-test-id="vulnerability-report"]').doesNotExist();
+
+    await click('[data-test-id="vulnerability-checkbox"]');
+    assert.dom('[data-test-id="vulnerability-checkbox"]').isChecked();
+    assert.dom('[data-test-id="vulnerability-report"]').exists();
+  });
 });