[ResourceTiming]: Factor out a helper to listen for entries

In order to make the distinction between setup code and asserting
invariants, factor out the code that collects PerformanceResourceTiming
entries and expose them through a Promise based API.

Bug: 1171767
Change-Id: Id86e51e845ada462c726de9172f65699f07d6ff9
GithubIssue: w3c/resource-timing#254
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2739405
Commit-Queue: Tom McKee <[email protected]>
Reviewed-by: Yoav Weiss <[email protected]>
Cr-Commit-Position: refs/heads/master@{#861756}
GitOrigin-RevId: 779dd8683a10cdaf9fe418edbc4fac9ef72ed00b

blink/web_tests/external/wpt/resource-timing/cross-origin-status-codes.html

@@ -19,38 +19,52 @@
 <script id="script_502"></script>
 <script>
 
-promise_test(t => {
+function listenForPerformanceEntries(num_expected) {
+  return new Promise(resolve => {
+    let results = [];
+    new PerformanceObserver(entryList => {
+      entryList.getEntries().forEach(entry => {
+        if (!entry.name.includes("status-code"))
+          return;
+
+        results.push(entry);
+        if (results.length == num_expected) {
+          resolve(results);
+        }
+      });
+    }).observe({entryTypes: ['resource']});
+  });
+}
+
+promise_test(async t => {
   const destUrl = get_host_info().HTTP_REMOTE_ORIGIN + '/resource-timing/resources/';
   const statusCodes = ['200', '307', '404', '502'];
 
+  let expected_entry_count = 0;
   statusCodes.forEach(status => {
     document.getElementById(`img_${status}`).src = `${destUrl}status-code.py?status=${status}`;
     document.getElementById(`script_${status}`).src = `${destUrl}status-code.py?status=${status}&script=1`;
+    expected_entry_count += 2;
   });
 
-  let nameMap = {};
-  let firstEntry = null;
-  // We will check that the non-timestamp values of the entry match for all entries.
-  const keys = ['entryType', 'nextHopProtocol', 'transferSize', 'encodedBodySize', 'decodedBodySize'];
-  return new Promise(resolve => {
-    new PerformanceObserver(t.step_func(entryList => {
-      entryList.getEntries().forEach(entry => {
-        if (!entry.name.includes("status-code"))
-          return;
+  const entries = await listenForPerformanceEntries(expected_entry_count);
 
-        nameMap[entry.name] = true;
-        if (!firstEntry) {
-          firstEntry = entry;
-        } else {
-          keys.forEach(key => {
-            assert_equals(entry[key], firstEntry[key], `Discernible difference in ${key} for ${entry.name}`);
-          });
-        }
-      });
-      if (Object.keys(nameMap).length === 8) {
-        resolve();
-      }
-    })).observe({entryTypes: ['resource']});
-  });
+  // We will check that the non-timestamp values of the entry match for all
+  // entries.
+  const keys = [
+    'entryType',
+    'nextHopProtocol',
+    'transferSize',
+    'encodedBodySize',
+    'decodedBodySize',
+  ];
+
+  const first = entries[0];
+  entries.slice(1).forEach(entry => {
+    keys.forEach(attribute => {
+      assert_equals(entry[attribute], first[attribute],
+        `There must be no discernible difference for the ${attribute} ` +
+        `attribute but found a difference for the ${entry.name} resource.`);
+  })});
 }, "Make sure cross origin resource fetch failures with different status codes are indistinguishable");
 </script>