Remove event races in two breakpoint decoration tests

This CL changes two layout tests to follow the pattern of:
  1. Install an instrumentation promise
  2. Run and await an async action
  3. Await that the instrumentation is called
  4. Dump breakpoint information

This CL is also in preparation for asyncification of source mapping,
hence making the "action" async.

Drive-by: Re-baseline one of the layout tests that seems to be fixed
now.

Bug: chromium:1032016
Change-Id: Ibad4160fe9ab32aa3f818cdd4937112c3f4e6f08
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2000023
Commit-Queue: Simon Zünd <szuend@chromium.org>
Reviewed-by: Sigurd Schneider <sigurds@chromium.org>
Cr-Commit-Position: refs/heads/master@{#731171}

third_party/blink/web_tests/http/tests/devtools/sources/debugger/source-frame-breakpoint-decorations-expected.txt

@@ -25,11 +25,13 @@ breakpoint at 2
   inline breakpoint at (2, 4)
   inline breakpoint at (2, 13) disabled
 Adding conditional enabled breakpoint
-breakpoint at 2
+breakpoint at 2 conditional
   inline breakpoint at (2, 4)
   inline breakpoint at (2, 13) disabled
 Disable breakpoints
-breakpoint at 2 disabled
+breakpoint at 2 disabled conditional
+  inline breakpoint at (2, 4) disabled
+  inline breakpoint at (2, 13) disabled
 Enable breakpoints
 breakpoint at 2 conditional
   inline breakpoint at (2, 4)

third_party/blink/web_tests/http/tests/devtools/sources/debugger/source-frame-breakpoint-decorations.js

@@ -8,9 +8,11 @@
   await TestRunner.showPanel('sources');
   await TestRunner.addScriptTag('resources/edit-me-breakpoints.js');
 
-  function waitAndDumpDecorations(sourceFrame) {
-    return SourcesTestRunner.waitDebuggerPluginBreakpoints(sourceFrame).then(
-        () => SourcesTestRunner.dumpDebuggerPluginBreakpoints(sourceFrame));
+  async function runAsyncBreakpointActionAndDumpDecorations(sourceFrame, action) {
+    const waitPromise = SourcesTestRunner.waitDebuggerPluginBreakpoints(sourceFrame);
+    await action();
+    await waitPromise;
+    SourcesTestRunner.dumpDebuggerPluginBreakpoints(sourceFrame);
   }
 
   Bindings.breakpointManager._storage._breakpoints = new Map();
@@ -22,15 +24,16 @@
       function addBreakpoint(sourceFrame) {
         javaScriptSourceFrame = sourceFrame;
         TestRunner.addResult('Setting breakpoint');
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, '', true)
-            .then(() => waitAndDumpDecorations(javaScriptSourceFrame))
-            .then(removeBreakpoint);
+        ).then(removeBreakpoint);
       }
 
       function removeBreakpoint() {
         TestRunner.addResult('Toggle breakpoint');
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2);
-        waitAndDumpDecorations(javaScriptSourceFrame).then(() => next());
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2)
+        ).then(next);
       }
     },
 
@@ -43,15 +46,16 @@
         TestRunner.addResult('Setting breakpoint');
         SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, '', true)
             .then(() => SourcesTestRunner.waitBreakpointSidebarPane(true))
-            .then(() => SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, 'true', true))
-            .then(() => waitAndDumpDecorations(javaScriptSourceFrame))
-            .then(removeBreakpoint);
+            .then(() => runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+              SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, 'true', true)
+            )).then(removeBreakpoint);
       }
 
       function removeBreakpoint() {
         TestRunner.addResult('Toggle breakpoint');
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2);
-        waitAndDumpDecorations(javaScriptSourceFrame).then(() => next());
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2)
+        ).then(next);
       }
     },
 
@@ -62,44 +66,51 @@
       function addRegularDisabled(sourceFrame) {
         javaScriptSourceFrame = sourceFrame;
         TestRunner.addResult('Adding regular disabled breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(addConditionalDisabled);
-        SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, '', false);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, '', false)
+        ).then(addConditionalDisabled);
       }
 
       function addConditionalDisabled() {
         TestRunner.addResult('Adding conditional disabled breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(addRegularEnabled);
-        SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, 'true', false);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, 'true', false)
+        ).then(addRegularEnabled);
       }
 
-      function addRegularEnabled() {
+      async function addRegularEnabled() {
         TestRunner.addResult('Adding regular enabled breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(addConditionalEnabled);
-        SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, '', true);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, '', true)
+        ).then(addConditionalEnabled);
       }
 
       function addConditionalEnabled() {
         TestRunner.addResult('Adding conditional enabled breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(disableAll);
-        SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, 'true', true);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 2, 'true', true)
+        ).then(disableAll);
       }
 
       function disableAll() {
         TestRunner.addResult('Disable breakpoints');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(enabledAll);
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2, true);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2, true)
+        ).then(enabledAll);
       }
 
       function enabledAll() {
         TestRunner.addResult('Enable breakpoints');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(removeAll);
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2, true);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2, true)
+        ).then(removeAll);
       }
 
       function removeAll() {
         TestRunner.addResult('Remove breakpoints');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(next);
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2, false);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 2, false)
+        ).then(next);
       }
     }
   ]);

third_party/blink/web_tests/http/tests/devtools/sources/debugger/source-frame-inline-breakpoint-decorations.js

@@ -30,10 +30,11 @@
       //# sourceURL=foo.js
     `);
 
-  function waitAndDumpDecorations(sourceFrame) {
-    return SourcesTestRunner.waitDebuggerPluginBreakpoints(sourceFrame)
-        .then(
-            () => SourcesTestRunner.dumpDebuggerPluginBreakpoints(sourceFrame));
+  async function runAsyncBreakpointActionAndDumpDecorations(sourceFrame, action) {
+    const waitPromise = SourcesTestRunner.waitDebuggerPluginBreakpoints(sourceFrame);
+    await action();
+    await waitPromise;
+    SourcesTestRunner.dumpDebuggerPluginBreakpoints(sourceFrame);
   }
 
   Bindings.breakpointManager._storage._breakpoints = new Map();
@@ -45,14 +46,16 @@
       function addBreakpoint(sourceFrame) {
         javaScriptSourceFrame = sourceFrame;
         TestRunner.addResult('Setting breakpoint');
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 11, '', true)
-            .then(() => waitAndDumpDecorations(javaScriptSourceFrame).then(removeBreakpoint));
+        ).then(removeBreakpoint);
       }
 
       function removeBreakpoint() {
         TestRunner.addResult('Toggle breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(() => next());
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 11);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 11)
+        ).then(next);
       }
     },
 
@@ -63,14 +66,16 @@
       function addBreakpoint(sourceFrame) {
         javaScriptSourceFrame = sourceFrame;
         TestRunner.addResult('Setting breakpoint');
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 13, '', true)
-            .then(() => waitAndDumpDecorations(javaScriptSourceFrame).then(removeBreakpoint));
+        ).then(removeBreakpoint);
       }
 
       function removeBreakpoint() {
         TestRunner.addResult('Toggle breakpoint');
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 13);
-        waitAndDumpDecorations(javaScriptSourceFrame).then(() => next());
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 13)
+        ).then(next);
       }
     },
 
@@ -81,29 +86,33 @@
       function addBreakpoint(sourceFrame) {
         javaScriptSourceFrame = sourceFrame;
         TestRunner.addResult('Setting breakpoint');
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 11, '', true)
-            .then(() => waitAndDumpDecorations(javaScriptSourceFrame).then(clickBySecondLocation));
+        ).then(clickBySecondLocation);
       }
 
       function clickBySecondLocation() {
         TestRunner.addResult('Click by second breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(clickByFirstLocation);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.clickDebuggerPluginBreakpoint(
-            javaScriptSourceFrame, 11, 1, next);
+              javaScriptSourceFrame, 11, 1, next)
+        ).then(clickByFirstLocation);
       }
 
       function clickByFirstLocation() {
         TestRunner.addResult('Click by first breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(clickBySecondLocationAgain);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.clickDebuggerPluginBreakpoint(
-            javaScriptSourceFrame, 11, 0, next);
+              javaScriptSourceFrame, 11, 0, next)
+        ).then(clickBySecondLocationAgain);
       }
 
       function clickBySecondLocationAgain() {
         TestRunner.addResult('Click by second breakpoint');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(() => next());
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
           SourcesTestRunner.clickDebuggerPluginBreakpoint(
-            javaScriptSourceFrame, 11, 1, next);
+              javaScriptSourceFrame, 11, 1, next)
+        ).then(next);
       }
     },
 
@@ -114,23 +123,26 @@
       function addBreakpoint(sourceFrame) {
         javaScriptSourceFrame = sourceFrame;
         TestRunner.addResult('Setting breakpoint in line 4');
-        SourcesTestRunner.toggleBreakpoint(sourceFrame, 12, false);
-        waitAndDumpDecorations(javaScriptSourceFrame).then(toggleBreakpointInAnotherLine);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 12, false)
+        ).then(toggleBreakpointInAnotherLine);
       }
 
       function toggleBreakpointInAnotherLine() {
         TestRunner.addResult('Setting breakpoint in line 3');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(removeBreakpoints);
-        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 11, false);
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+          SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 11, false)
+        ).then(removeBreakpoints);
       }
 
       function removeBreakpoints() {
         TestRunner.addResult('Click by first inline breakpoints');
-        waitAndDumpDecorations(javaScriptSourceFrame).then(() => next());
+        runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () => {
           SourcesTestRunner.clickDebuggerPluginBreakpoint(
               javaScriptSourceFrame, 11, 0, next);
           SourcesTestRunner.clickDebuggerPluginBreakpoint(
               javaScriptSourceFrame, 12, 0, next);
+        }).then(next);
       }
     },
 
@@ -138,13 +150,14 @@
       let javaScriptSourceFrame = await SourcesTestRunner.showScriptSourcePromise('foo.js');
 
       TestRunner.addResult('Setting breakpoint');
-      await SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 16, '', true)
-      await waitAndDumpDecorations(javaScriptSourceFrame);
+      await runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+        SourcesTestRunner.createNewBreakpoint(javaScriptSourceFrame, 16, '', true)
+      );
 
       TestRunner.addResult('Toggle breakpoint');
-      let decorationsPromise = waitAndDumpDecorations(javaScriptSourceFrame);
-      SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 28);
-      await decorationsPromise;
+      await runAsyncBreakpointActionAndDumpDecorations(javaScriptSourceFrame, () =>
+        SourcesTestRunner.toggleBreakpoint(javaScriptSourceFrame, 28)
+      );
       next();
     }
   ]);