[triage] Add a 'file issue' link for test-level issues (#2439)

The link is only added for test-level issues, and links to the new-issue
interface in the wpt-metadata repository. The title is pre-filled based
on the test name, and a 'compat2021-test-issue' label is added.

Fixes #2420

Author: stephenmcgruer

webapp/components/test/wpt-amend-metadata.html

@@ -152,6 +152,19 @@
       expect(appFixture.getSearchURL('/a/b.html', 'webkitgtk')).to.equal('https://bugs.webkit.org/buglist.cgi?quicksearch="/a/b"');
       expect(appFixture.getSearchURL('/a/b.html', 'servo')).to.equal('https://github.com/servo/servo/issues?q="/a/b"');
     });
+    test('hasFileIssueURL', () => {
+      expect(appFixture.hasFileIssueURL('')).to.be.true;
+      expect(appFixture.hasFileIssueURL(null)).to.be.false;
+      expect(appFixture.hasFileIssueURL(undefined)).to.be.false;
+      expect(appFixture.hasFileIssueURL('chrome')).to.be.false;
+      expect(appFixture.hasFileIssueURL('firefox')).to.be.false;
+    });
+    test('getFileIssueURL', () => {
+      const expectedURL = 'https://github.com/web-platform-tests/wpt-metadata' +
+          '/issues/new?title=%5Bcompat2021%5D+%2Ffoo%2Fbar.html+fails+due+to' +
+          '+test+issue&labels=compat2021-test-issue';
+      expect(appFixture.getFileIssueURL('/foo/bar.html')).to.equal(expectedURL);
+    });
   });
 });
 </script>

webapp/components/wpt-amend-metadata.js

@@ -106,6 +106,9 @@ const AmendMetadataMixin = (superClass) => class extends superClass {
   }
 };
 
+// AmendMetadata is a UI component that allows the user to associate a set of
+// tests or test results with a URL (usually a link to a bug-tracker). It is
+// commonly referred to as the 'triage UI'.
 class AmendMetadata extends LoadingState(PathInfo(ProductInfo(PolymerElement))) {
   static get is() {
     return 'wpt-amend-metadata';
@@ -168,6 +171,9 @@ class AmendMetadata extends LoadingState(PathInfo(ProductInfo(PolymerElement)))
                 <template is="dom-if" if="[[hasSearchURL(node.product)]]">
                   <a href="[[getSearchURL(test, node.product)]]" target="_blank"> [Search for bug] </a>
                 </template>
+                <template is="dom-if" if="[[hasFileIssueURL(node.product)]]">
+                  <a href="[[getFileIssueURL(test)]]" target="_blank"> [File test-level issue] </a>
+                </template>
               </li>
             </template>
           </template>
@@ -293,6 +299,20 @@ class AmendMetadata extends LoadingState(PathInfo(ProductInfo(PolymerElement)))
     }
   }
 
+  hasFileIssueURL(product) {
+    // We only support filing issues for test-level problems
+    // (https://github.com/web-platform-tests/wpt.fyi/issues/2420). In this
+    // class the test-level product is represented by an empty string.
+    return product === '';
+  }
+
+  getFileIssueURL(testName) {
+    const params = new URLSearchParams();
+    params.append('title', `[compat2021] ${testName} fails due to test issue`);
+    params.append('labels', 'compat2021-test-issue');
+    return `https://github.com/web-platform-tests/wpt-metadata/issues/new?${params}`;
+  }
+
   populateDisplayData() {
     this.displayedMetadata = [];
     const browserMap = {};