chrome-devtools-frontend 1.0.1386602 → 1.0.1402249

package/front_end/panels/recorder/models/RecordingPlayer.test.ts

@@ -85,7 +85,7 @@ describe('RecordingPlayer', () => {
       void recordingPlayer.play();
       await stopEventPromise;
 
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 2);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 2);
     });
 
     it('should `stepOver` execute only the next step after breakpoint and stop', async () => {
@@ -132,11 +132,11 @@ describe('RecordingPlayer', () => {
 
       void recordingPlayer.play();
       await stopEventPromise;
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 2);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 2);
       recordingPlayer.stepOver();
       await stopEventPromise;
 
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 3);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 3);
     });
 
     it('should `continue` execute until the next breakpoint', async () => {
@@ -184,11 +184,11 @@ describe('RecordingPlayer', () => {
 
       void recordingPlayer.play();
       await stopEventPromise;
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 2);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 2);
       recordingPlayer.continue();
       await stopEventPromise;
 
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 4);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 4);
     });
 
     it('should `continue` execute until the end if there is no later breakpoints', async () => {
@@ -245,11 +245,11 @@ describe('RecordingPlayer', () => {
 
       void recordingPlayer.play();
       await stopEventPromise;
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 2);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 2);
       recordingPlayer.continue();
       await doneEventPromise;
 
-      assert.strictEqual(stepEventHandlerStub.getCalls().length, 5);
+      assert.lengthOf(stepEventHandlerStub.getCalls(), 5);
     });
   });
 });

package/front_end/panels/recorder/models/SchemaUtils.ts

@@ -31,7 +31,12 @@ export function createEmulateNetworkConditionsStep(conditions: {
   upload: number,
   latency: number,
 }): EmulateNetworkConditionsStep {
-  return {type: StepType.EmulateNetworkConditions, ...conditions};
+  return {
+    type: StepType.EmulateNetworkConditions,
+    download: conditions.download,
+    upload: conditions.upload,
+    latency: conditions.latency,
+  };
 }
 
 export function areSelectorsEqual(stepA: Step, stepB: Step): boolean {

package/front_end/panels/recorder/models/ScreenshotUtils.test.ts

@@ -46,25 +46,25 @@ describe('ScreenshotUtils', () => {
 
   it('can resize screenshots to be 160px wide and <= 240px high', async () => {
     const {resizeScreenshot} = Models.ScreenshotUtils;
-    assert.deepStrictEqual(
+    assert.deepEqual(
         await getScreenshotDimensions(
             await resizeScreenshot(await generateImage(400, 800)),
             ),
         [160, 240],
     );
-    assert.deepStrictEqual(
+    assert.deepEqual(
         await getScreenshotDimensions(
             await resizeScreenshot(await generateImage(800, 400)),
             ),
         [160, 80],
     );
-    assert.deepStrictEqual(
+    assert.deepEqual(
         await getScreenshotDimensions(
             await resizeScreenshot(await generateImage(80, 80)),
             ),
         [160, 160],
     );
-    assert.deepStrictEqual(
+    assert.deepEqual(
         await getScreenshotDimensions(
             await resizeScreenshot(await generateImage(80, 320)),
             ),

package/front_end/panels/recorder/models/Section.test.ts

@@ -40,13 +40,13 @@ describe('Section', () => {
     }
 
     it('should build not sections for empty steps', () => {
-      assert.deepStrictEqual(buildSections([]), []);
+      assert.deepEqual(buildSections([]), []);
     });
 
     it('should build a current page section for initial steps that do not cause navigation', () => {
       const step1 = makeStep();
       const step2 = makeStep();
-      assert.deepStrictEqual(buildSections([step1, step2]), [
+      assert.deepEqual(buildSections([step1, step2]), [
         {title: 'Current page', url: '', steps: [step1, step2]},
       ]);
     });
@@ -55,7 +55,7 @@ describe('Section', () => {
       {
         const step1 = makeNavigateStep();
         const step2 = makeStep();
-        assert.deepStrictEqual(buildSections([step1, step2]), [
+        assert.deepEqual(buildSections([step1, step2]), [
           {
             title: 'Test',
             url: 'https://example.com',
@@ -65,7 +65,7 @@ describe('Section', () => {
         ]);
       }
 
-      {const step1 = makeStepCausingNavigation(); const step2 = makeStep(); assert.deepStrictEqual(
+      {const step1 = makeStepCausingNavigation(); const step2 = makeStep(); assert.deepEqual(
           buildSections([step1, step2]),
           [
             {title: 'Current page', url: '', steps: [step1]},
@@ -80,7 +80,7 @@ describe('Section', () => {
       const step4 = makeStepCausingNavigation();
       const step5 = makeStep();
 
-      assert.deepStrictEqual(
+      assert.deepEqual(
           buildSections([step1, step2, step3, step4, step5]),
           [
             {title: 'Current page', url: '', steps: [step1, step2]},

package/front_end/panels/recorder/models/recording-storage.test.ts

@@ -48,7 +48,7 @@ describeWithEnvironment('RecordingStorage', () => {
       storageName: 'recording_2',
       flow: flow2,
     });
-    assert.deepEqual(await storage.getRecording('recording_3'), undefined);
+    assert.isUndefined(await storage.getRecording('recording_3'));
     assert.deepEqual(await storage.updateRecording('recording_2', flow3), {
       storageName: 'recording_2',
       flow: flow3,

package/front_end/panels/recorder/models/screenshot-storage.test.ts

@@ -53,7 +53,7 @@ describeWithEnvironment('ScreenshotStorage', () => {
     const setting = Common.Settings.Settings.instance().createSetting<Recorder.ScreenshotStorage.ScreenshotMetaData[]>(
         'recorder-screenshots', []);
     const value = setting.get();
-    assert.strictEqual(value.length, 1);
+    assert.lengthOf(value, 1);
     assert.strictEqual(value[0].index, 1);
     assert.strictEqual(value[0].data, imageData);
   });

package/front_end/panels/screencast/ScreencastView.ts

@@ -159,11 +159,10 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
     this.element.classList.add('screencast');
 
     this.createNavigationBar();
-    this.viewportElement = this.element.createChild('div', 'screencast-viewport hidden') as HTMLElement;
-    this.canvasContainerElement = this.viewportElement.createChild('div', 'screencast-canvas-container') as HTMLElement;
-    this.glassPaneElement =
-        this.canvasContainerElement.createChild('div', 'screencast-glasspane fill hidden') as HTMLElement;
-    this.canvasElement = this.canvasContainerElement.createChild('canvas') as HTMLCanvasElement;
+    this.viewportElement = this.element.createChild('div', 'screencast-viewport hidden');
+    this.canvasContainerElement = this.viewportElement.createChild('div', 'screencast-canvas-container');
+    this.glassPaneElement = this.canvasContainerElement.createChild('div', 'screencast-glasspane fill hidden');
+    this.canvasElement = this.canvasContainerElement.createChild('canvas');
     UI.ARIAUtils.setLabel(this.canvasElement, i18nString(UIStrings.screencastViewOfDebugTarget));
     this.canvasElement.tabIndex = 0;
     this.canvasElement.addEventListener('mousedown', this.handleMouseEvent.bind(this), false);
@@ -176,15 +175,14 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
     this.canvasElement.addEventListener('keyup', this.handleKeyEvent.bind(this), false);
     this.canvasElement.addEventListener('keypress', this.handleKeyEvent.bind(this), false);
     this.canvasElement.addEventListener('blur', this.handleBlurEvent.bind(this), false);
-    this.titleElement =
-        this.canvasContainerElement.createChild('div', 'screencast-element-title monospace hidden') as HTMLElement;
-    this.tagNameElement = this.titleElement.createChild('span', 'screencast-tag-name') as HTMLElement;
-    this.attributeElement = this.titleElement.createChild('span', 'screencast-attribute') as HTMLElement;
+    this.titleElement = this.canvasContainerElement.createChild('div', 'screencast-element-title monospace hidden');
+    this.tagNameElement = this.titleElement.createChild('span', 'screencast-tag-name');
+    this.attributeElement = this.titleElement.createChild('span', 'screencast-attribute');
     UI.UIUtils.createTextChild(this.titleElement, ' ');
-    const dimension = this.titleElement.createChild('span', 'screencast-dimension') as HTMLElement;
-    this.nodeWidthElement = dimension.createChild('span') as HTMLElement;
+    const dimension = this.titleElement.createChild('span', 'screencast-dimension');
+    this.nodeWidthElement = dimension.createChild('span');
     UI.UIUtils.createTextChild(dimension, ' × ');
-    this.nodeHeightElement = dimension.createChild('span') as HTMLElement;
+    this.nodeHeightElement = dimension.createChild('span');
     this.titleElement.style.top = '0';
     this.titleElement.style.left = '0';
 
@@ -674,9 +672,9 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
   }
 
   private createNavigationBar(): void {
-    this.navigationBar = this.element.createChild('div', 'screencast-navigation') as HTMLElement;
+    this.navigationBar = this.element.createChild('div', 'screencast-navigation');
 
-    this.navigationBack = this.navigationBar.createChild('button', 'navigation') as HTMLButtonElement;
+    this.navigationBack = this.navigationBar.createChild('button', 'navigation');
     {
       const icon = this.navigationBack.appendChild(new IconButton.Icon.Icon());
       icon.data = {color: 'var(--icon-default)', iconName: 'arrow-back'};
@@ -684,7 +682,7 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
     this.navigationBack.disabled = true;
     UI.ARIAUtils.setLabel(this.navigationBack, i18nString(UIStrings.back));
 
-    this.navigationForward = this.navigationBar.createChild('button', 'navigation') as HTMLButtonElement;
+    this.navigationForward = this.navigationBar.createChild('button', 'navigation');
     {
       const icon = this.navigationForward.appendChild(new IconButton.Icon.Icon());
       icon.data = {color: 'var(--icon-default)', iconName: 'arrow-forward'};
@@ -699,11 +697,11 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
     }
     UI.ARIAUtils.setLabel(this.navigationReload, i18nString(UIStrings.reload));
 
-    this.navigationUrl = this.navigationBar.appendChild(UI.UIUtils.createInput()) as HTMLInputElement;
+    this.navigationUrl = this.navigationBar.appendChild(UI.UIUtils.createInput());
     this.navigationUrl.type = 'text';
     UI.ARIAUtils.setLabel(this.navigationUrl, i18nString(UIStrings.addressBar));
 
-    this.mouseInputToggle = this.navigationBar.createChild('button') as HTMLButtonElement;
+    this.mouseInputToggle = this.navigationBar.createChild('button');
     this.mouseInputToggle.disabled = true;
     {
       this.mouseInputToggleIcon = this.mouseInputToggle.appendChild(new IconButton.Icon.Icon());
@@ -711,7 +709,7 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
     }
     UI.ARIAUtils.setLabel(this.mouseInputToggle, i18nString(UIStrings.mouseInput));
 
-    this.touchInputToggle = this.navigationBar.createChild('button') as HTMLButtonElement;
+    this.touchInputToggle = this.navigationBar.createChild('button');
     {
       this.touchInputToggleIcon = this.touchInputToggle.appendChild(new IconButton.Icon.Icon());
       this.touchInputToggleIcon.data = {color: 'var(--icon-default)', iconName: 'touch-app'};
@@ -719,7 +717,7 @@ export class ScreencastView extends UI.Widget.VBox implements SDK.OverlayModel.H
     UI.ARIAUtils.setLabel(this.touchInputToggle, i18nString(UIStrings.touchInput));
 
     this.navigationProgressBar = new ProgressTracker(
-        this.resourceTreeModel, this.networkManager, this.navigationBar.createChild('div', 'progress') as HTMLElement);
+        this.resourceTreeModel, this.networkManager, this.navigationBar.createChild('div', 'progress'));
 
     if (this.resourceTreeModel) {
       this.navigationBack.addEventListener('click', this.navigateToHistoryEntry.bind(this, -1), false);

package/front_end/panels/screencast/screencastView.css

@@ -94,6 +94,7 @@
 }
 
 .screencast-canvas-container.touchable {
+  /* stylelint-disable-next-line custom-property-pattern */
   cursor: image-set(var(--image-file-touchCursor) 1x, var(--image-file-touchCursor_2x) 2x), default;
 }
 

package/front_end/panels/search/SearchView.ts

@@ -119,7 +119,7 @@ export class SearchView extends UI.Widget.VBox {
   private visiblePane: UI.Widget.Widget|null;
   private readonly searchPanelElement: HTMLElement;
   private readonly searchResultsElement: HTMLElement;
-  protected readonly search: UI.HistoryInput.HistoryInput;
+  protected readonly search: HTMLInputElement;
   protected readonly matchCaseButton: Buttons.Button.Button;
   protected readonly regexButton: Buttons.Button.Button;
   private searchMessageElement: HTMLElement;
@@ -174,7 +174,7 @@ export class SearchView extends UI.Widget.VBox {
     const searchIcon = IconButton.Icon.create('search');
     searchElements.appendChild(searchIcon);
 
-    this.search = UI.HistoryInput.HistoryInput.create();
+    this.search = UI.UIUtils.createHistoryInput('search', 'search-toolbar-input');
     this.search.addEventListener('keydown', event => {
       this.onKeyDown((event as KeyboardEvent));
     });
@@ -182,10 +182,8 @@ export class SearchView extends UI.Widget.VBox {
         'jslog', `${VisualLogging.textField().track({change: true, keydown: 'ArrowUp|ArrowDown|Enter'})}`);
     searchElements.appendChild(this.search);
     this.search.placeholder = i18nString(UIStrings.find);
-    this.search.setAttribute('type', 'search');
     this.search.setAttribute('results', '0');
     this.search.setAttribute('size', '100');
-    this.search.classList.add('search-toolbar-input');
     UI.ARIAUtils.setLabel(this.search, this.search.placeholder);
 
     const clearInputFieldButton = new Buttons.Button.Button();

package/front_end/panels/security/CookieControlsView.test.ts

@@ -20,10 +20,10 @@ describeWithMockConnection('CookieControlsView', () => {
     const view = new Security.CookieControlsView.CookieControlsView(undefined, mockView);
     const reloadRequiredInfobarSpy =
         sinon.spy(UI.InspectorView.InspectorView.instance(), 'displayDebuggedTabReloadRequiredWarning');
-    assert.strictEqual(testSetting.get(), true);
+    assert.isTrue(testSetting.get());
 
     view.inputChanged(false, testSetting);
-    assert.strictEqual(testSetting.get(), false);
+    assert.isFalse(testSetting.get());
     assert.isTrue(reloadRequiredInfobarSpy.calledOnce);
   });
 });

package/front_end/panels/security/CookieControlsView.ts

@@ -107,12 +107,35 @@ export class CookieControlsView extends UI.Widget.VBox {
   #view: View;
 
   constructor(element?: HTMLElement, view: View = (input, output, target) => {
-    // TODO(crbug.com/365737493): Determine whether the enterprise is present based on UI bindings
-    const enterprisePresent = false;
+    const thirdPartyControlsDict = Common.Settings.Settings.instance().getHostConfig().thirdPartyCookieControls;
 
-    const toggleSetting = Common.Settings.Settings.instance().moduleSetting('cookie-control-override-enabled');
-    const gracePeriodSetting = Common.Settings.Settings.instance().moduleSetting('grace-period-mitigation-disabled');
-    const heuristicSetting = Common.Settings.Settings.instance().moduleSetting('heuristic-mitigation-disabled');
+    // createSetting() allows us to initialize the settings with the UI binding values the first
+    // time that the browser starts, and use the existing setting value for all subsequent uses.
+    const enterpriseEnabledSetting = Common.Settings.Settings.instance().createSetting(
+        'enterprise-enabled',
+        thirdPartyControlsDict && thirdPartyControlsDict.managedBlockThirdPartyCookies &&
+                typeof thirdPartyControlsDict.managedBlockThirdPartyCookies === 'boolean' ?
+            thirdPartyControlsDict.managedBlockThirdPartyCookies :
+            false,
+        Common.Settings.SettingStorageType.GLOBAL);
+    const toggleEnabledSetting = Common.Settings.Settings.instance().createSetting(
+        'cookie-control-override-enabled',
+        thirdPartyControlsDict && thirdPartyControlsDict.thirdPartyCookieRestrictionEnabled ?
+            thirdPartyControlsDict.thirdPartyCookieRestrictionEnabled :
+            false,
+        Common.Settings.SettingStorageType.GLOBAL);
+    const gracePeriodDisabledSetting = Common.Settings.Settings.instance().createSetting(
+        'grace-period-mitigation-disabled',
+        thirdPartyControlsDict && thirdPartyControlsDict.thirdPartyCookieMetadataEnabled ?
+            thirdPartyControlsDict.thirdPartyCookieMetadataEnabled :
+            true,
+        Common.Settings.SettingStorageType.GLOBAL);
+    const heuristicsDisabledSetting = Common.Settings.Settings.instance().createSetting(
+        'heuristic-mitigation-disabled',
+        thirdPartyControlsDict && thirdPartyControlsDict.thirdPartyCookieHeuristicsEnabled ?
+            thirdPartyControlsDict.thirdPartyCookieHeuristicsEnabled :
+            true,
+        Common.Settings.SettingStorageType.GLOBAL);
 
     // clang-format off
     const cardHeader = html `
@@ -122,7 +145,7 @@ export class CookieControlsView extends UI.Widget.VBox {
             <div class="card-title">${i18nString(UIStrings.cardTitle)}</div>
             <div class="body">${i18nString(UIStrings.cardDisclaimer)}</div>
           </div>
-          ${enterprisePresent ? html `
+          ${Boolean(enterpriseEnabledSetting.get()) ? html `
             <devtools-icon
               .name=${'domain'}
               ${LitHtml.Directives.ref((el: Element|undefined) => {
@@ -133,10 +156,10 @@ export class CookieControlsView extends UI.Widget.VBox {
         </div>
         <div>
           <devtools-switch
-            .checked=${Boolean(toggleSetting.get())}
-            .disabled=${enterprisePresent}
+            .checked=${Boolean(toggleEnabledSetting.get())}
+            .disabled=${Boolean(enterpriseEnabledSetting.get())}
             @switchchange=${(e: Event)=>{
-                input.inputChanged((e.target as HTMLInputElement).checked, toggleSetting);
+                input.inputChanged((e.target as HTMLInputElement).checked, toggleEnabledSetting);
               }}>
           </devtools-switch>
         </div>
@@ -147,17 +170,17 @@ export class CookieControlsView extends UI.Widget.VBox {
       <div class="card-row">
         <label class='checkbox-label'>
           <input type='checkbox'
-            ?disabled=${enterprisePresent || !Boolean(toggleSetting.get())}
-            ?checked=${!Boolean(gracePeriodSetting.get())}
+            .disabled=${Boolean(enterpriseEnabledSetting.get()) || !Boolean(toggleEnabledSetting.get())}
+            .checked=${Boolean(toggleEnabledSetting.get()) && !Boolean(gracePeriodDisabledSetting.get())}
             @change=${(e: Event)=>{
-              input.inputChanged(!(e.target as HTMLInputElement).checked, gracePeriodSetting);
+              input.inputChanged((e.target as HTMLInputElement).checked, gracePeriodDisabledSetting);
             }}
           >
           <div class="text">
             <div class="body">${i18nString(UIStrings.gracePeriodTitle)}</div>
             <div class="body">
               ${i18nFormatString(UIStrings.gracePeriodExplanation, {
-                  PH1: enterprisePresent ? i18nString(UIStrings.gracePeriod) :  UI.Fragment.html`<x-link class="x-link" href="https://developers.google.com/privacy-sandbox/cookies/temporary-exceptions/grace-period" jslog=${VisualLogging.link('grace-period-link').track({click: true})}>${i18nString(UIStrings.gracePeriod)}</x-link>`,
+                  PH1: Boolean(enterpriseEnabledSetting.get()) ? i18nString(UIStrings.gracePeriod) :  UI.Fragment.html`<x-link class="x-link" href="https://developers.google.com/privacy-sandbox/cookies/temporary-exceptions/grace-period" jslog=${VisualLogging.link('grace-period-link').track({click: true})}>${i18nString(UIStrings.gracePeriod)}</x-link>`,
                 })}
             </div>
           </div>
@@ -169,17 +192,17 @@ export class CookieControlsView extends UI.Widget.VBox {
       <div class="card-row">
         <label class='checkbox-label'>
           <input type='checkbox'
-            ?disabled=${enterprisePresent || !Boolean(toggleSetting.get())}
-            ?checked=${!Boolean(heuristicSetting.get())}
+            .disabled=${Boolean(enterpriseEnabledSetting.get()) || !Boolean(toggleEnabledSetting.get())}
+            .checked=${Boolean(toggleEnabledSetting.get() && !Boolean(heuristicsDisabledSetting.get()))}
             @change=${(e: Event)=>{
-              input.inputChanged(!(e.target as HTMLInputElement).checked, heuristicSetting);
+              input.inputChanged((e.target as HTMLInputElement).checked, heuristicsDisabledSetting);
             }}
           >
           <div class="text">
             <div class="body">${i18nString(UIStrings.heuristicTitle)}</div>
             <div class="body">
               ${i18nFormatString(UIStrings.heuristicExplanation, {
-                  PH1: enterprisePresent ? i18nString(UIStrings.scenarios) : UI.Fragment.html`<x-link class="x-link" href="https://developers.google.com/privacy-sandbox/cookies/temporary-exceptions/heuristics-based-exceptions" jslog=${VisualLogging.link('heuristic-link').track({click: true})}>${i18nString(UIStrings.scenarios)}</x-link>`,
+                  PH1: Boolean(enterpriseEnabledSetting.get()) ? i18nString(UIStrings.scenarios) : UI.Fragment.html`<x-link class="x-link" href="https://developers.google.com/privacy-sandbox/cookies/temporary-exceptions/heuristics-based-exceptions" jslog=${VisualLogging.link('heuristic-link').track({click: true})}>${i18nString(UIStrings.scenarios)}</x-link>`,
                 })}
             </div>
           </div>
@@ -211,7 +234,7 @@ export class CookieControlsView extends UI.Widget.VBox {
             <div class="body">${i18nString(UIStrings.viewExplanation)}</div>
           </div>
           <devtools-card>
-            <div slot="content" class=${enterprisePresent ? 'card enterprise-disabled' : 'card'}>
+            <div slot="content" class=${Boolean(enterpriseEnabledSetting.get()) ? 'card enterprise-disabled' : 'card'}>
               ${cardHeader}
               <div>
                 <div class="card-row text">
@@ -223,7 +246,7 @@ export class CookieControlsView extends UI.Widget.VBox {
               </div>
             </div>
           </devtools-card>
-          ${enterprisePresent ? enterpriseDisclaimer : LitHtml.nothing}
+          ${Boolean(enterpriseEnabledSetting.get()) ? enterpriseDisclaimer : LitHtml.nothing}
         </div>
       </div>
     `, target, {host: this});

package/front_end/panels/security/CookieReportView.test.ts

@@ -55,7 +55,7 @@ describeWithMockConnection('CookieReportView', () => {
   it('should contain no rows if no issues were created', async () => {
     const view = new Security.CookieReportView.CookieReportView(undefined, mockView);
 
-    assert.strictEqual(view.gridData.length, 0);
+    assert.lengthOf(view.gridData, 0);
   });
 
   it('should have row when there was a preexisting cookie issue', async () => {
@@ -63,22 +63,22 @@ describeWithMockConnection('CookieReportView', () => {
     globalThis.addIssueForTest(getTestCookieIssue());
 
     const view = new Security.CookieReportView.CookieReportView(undefined, mockView);
-    await view.pendingUpdate();
+    await view.updateComplete;
 
-    assert.strictEqual(view.gridData.length, 1);
+    assert.lengthOf(view.gridData, 1);
   });
 
   it('should add row when issue added after view creation', async () => {
     const view = new Security.CookieReportView.CookieReportView(undefined, mockView);
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 0);
+    assert.lengthOf(view.gridData, 0);
 
     // @ts-ignore
     globalThis.addIssueForTest(getTestCookieIssue());
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 1);
+    assert.lengthOf(view.gridData, 1);
   });
 
   it('should ignore non-third-party-cookie related exclusionReason', async () => {
@@ -87,16 +87,16 @@ describeWithMockConnection('CookieReportView', () => {
     // @ts-ignore
     globalThis.addIssueForTest(
         getTestCookieIssue(undefined, Protocol.Audits.CookieExclusionReason.ExcludeSameSiteNoneInsecure));
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 0);
+    assert.lengthOf(view.gridData, 0);
 
     // Make sure ExcludeThirdPartyPhaseout (default) is added.
     // @ts-ignore
     globalThis.addIssueForTest(getTestCookieIssue());
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 1);
+    assert.lengthOf(view.gridData, 1);
     assert.strictEqual(view.gridData[0].data.status, 'Blocked');
   });
 
@@ -106,9 +106,9 @@ describeWithMockConnection('CookieReportView', () => {
     // @ts-ignore
     globalThis.addIssueForTest(
         getTestCookieIssue(undefined, undefined, Protocol.Audits.CookieWarningReason.WarnSameSiteLaxCrossDowngradeLax));
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 0);
+    assert.lengthOf(view.gridData, 0);
 
     // Make sure warning 3pc warning reasons are added
     // @ts-ignore
@@ -120,9 +120,9 @@ describeWithMockConnection('CookieReportView', () => {
     // @ts-ignore
     globalThis.addIssueForTest(getTestCookieIssue(
         undefined, undefined, Protocol.Audits.CookieWarningReason.WarnThirdPartyPhaseout, 'phaseout'));
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 3);
+    assert.lengthOf(view.gridData, 3);
     assert.strictEqual(view.gridData[0].data.status, 'Allowed By Exception');
     assert.strictEqual(view.gridData[1].data.status, 'Allowed By Exception');
     assert.strictEqual(view.gridData[2].data.status, 'Allowed');
@@ -135,9 +135,9 @@ describeWithMockConnection('CookieReportView', () => {
     globalThis.addIssueForTest(getTestCookieIssue(true));
     // @ts-ignore
     globalThis.addIssueForTest(getTestCookieIssue(false));
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 1);
+    assert.lengthOf(view.gridData, 1);
   });
 
   it('should have zero entries after the primary page was changed', async () => {
@@ -145,13 +145,13 @@ describeWithMockConnection('CookieReportView', () => {
 
     // @ts-ignore
     globalThis.addIssueForTest(getTestCookieIssue(true));
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 1);
+    assert.lengthOf(view.gridData, 1);
 
     navigate(getMainFrame(target));
+    await view.updateComplete;
 
-    await view.pendingUpdate();
-    assert.strictEqual(view.gridData.length, 0);
+    assert.lengthOf(view.gridData, 0);
   });
 });