chrome-devtools-frontend 1.0.930993 → 1.0.932348

package/front_end/panels/animation/AnimationModel.ts

@@ -9,44 +9,44 @@ import * as Protocol from '../../generated/protocol.js';
 export class AnimationModel extends SDK.SDKModel.SDKModel<EventTypes> {
   readonly runtimeModel: SDK.RuntimeModel.RuntimeModel;
   readonly agent: ProtocolProxyApi.AnimationApi;
-  private animationsById: Map<string, AnimationImpl>;
+  #animationsById: Map<string, AnimationImpl>;
   readonly animationGroups: Map<string, AnimationGroup>;
-  private pendingAnimations: Set<string>;
+  #pendingAnimations: Set<string>;
   playbackRate: number;
-  private readonly screenshotCapture?: ScreenshotCapture;
-  private enabled?: boolean;
+  readonly #screenshotCapture?: ScreenshotCapture;
+  #enabled?: boolean;
 
   constructor(target: SDK.Target.Target) {
     super(target);
     this.runtimeModel = (target.model(SDK.RuntimeModel.RuntimeModel) as SDK.RuntimeModel.RuntimeModel);
     this.agent = target.animationAgent();
     target.registerAnimationDispatcher(new AnimationDispatcher(this));
-    this.animationsById = new Map();
+    this.#animationsById = new Map();
     this.animationGroups = new Map();
-    this.pendingAnimations = new Set();
+    this.#pendingAnimations = new Set();
     this.playbackRate = 1;
     const resourceTreeModel =
         (target.model(SDK.ResourceTreeModel.ResourceTreeModel) as SDK.ResourceTreeModel.ResourceTreeModel);
     resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.MainFrameNavigated, this.reset, this);
     const screenCaptureModel = target.model(SDK.ScreenCaptureModel.ScreenCaptureModel);
     if (screenCaptureModel) {
-      this.screenshotCapture = new ScreenshotCapture(this, screenCaptureModel);
+      this.#screenshotCapture = new ScreenshotCapture(this, screenCaptureModel);
     }
   }
 
   private reset(): void {
-    this.animationsById.clear();
+    this.#animationsById.clear();
     this.animationGroups.clear();
-    this.pendingAnimations.clear();
+    this.#pendingAnimations.clear();
     this.dispatchEventToListeners(Events.ModelReset);
   }
 
   animationCreated(id: string): void {
-    this.pendingAnimations.add(id);
+    this.#pendingAnimations.add(id);
   }
 
   animationCanceled(id: string): void {
-    this.pendingAnimations.delete(id);
+    this.#pendingAnimations.delete(id);
     this.flushPendingAnimationsIfNeeded();
   }
 
@@ -64,23 +64,23 @@ export class AnimationModel extends SDK.SDKModel.SDKModel<EventTypes> {
     // Ignore Web Animations custom effects & groups.
     const keyframesRule = animation.source().keyframesRule();
     if (animation.type() === 'WebAnimation' && keyframesRule && keyframesRule.keyframes().length === 0) {
-      this.pendingAnimations.delete(animation.id());
+      this.#pendingAnimations.delete(animation.id());
     } else {
-      this.animationsById.set(animation.id(), animation);
-      this.pendingAnimations.add(animation.id());
+      this.#animationsById.set(animation.id(), animation);
+      this.#pendingAnimations.add(animation.id());
     }
 
     this.flushPendingAnimationsIfNeeded();
   }
 
   private flushPendingAnimationsIfNeeded(): void {
-    for (const id of this.pendingAnimations) {
-      if (!this.animationsById.get(id)) {
+    for (const id of this.#pendingAnimations) {
+      if (!this.#animationsById.get(id)) {
         return;
       }
     }
 
-    while (this.pendingAnimations.size) {
+    while (this.#pendingAnimations.size) {
       this.matchExistingGroups(this.createGroupFromPendingAnimations());
     }
   }
@@ -97,8 +97,8 @@ export class AnimationModel extends SDK.SDKModel.SDKModel<EventTypes> {
 
     if (!matchedGroup) {
       this.animationGroups.set(incomingGroup.id(), incomingGroup);
-      if (this.screenshotCapture) {
-        this.screenshotCapture.captureScreenshots(incomingGroup.finiteDuration(), incomingGroup.screenshotsInternal);
+      if (this.#screenshotCapture) {
+        this.#screenshotCapture.captureScreenshots(incomingGroup.finiteDuration(), incomingGroup.screenshotsInternal);
       }
     }
     this.dispatchEventToListeners(Events.AnimationGroupStarted, matchedGroup || incomingGroup);
@@ -106,11 +106,11 @@ export class AnimationModel extends SDK.SDKModel.SDKModel<EventTypes> {
   }
 
   private createGroupFromPendingAnimations(): AnimationGroup {
-    console.assert(this.pendingAnimations.size > 0);
-    const firstAnimationId = this.pendingAnimations.values().next().value;
-    this.pendingAnimations.delete(firstAnimationId);
+    console.assert(this.#pendingAnimations.size > 0);
+    const firstAnimationId = this.#pendingAnimations.values().next().value;
+    this.#pendingAnimations.delete(firstAnimationId);
 
-    const firstAnimation = this.animationsById.get(firstAnimationId);
+    const firstAnimation = this.#animationsById.get(firstAnimationId);
     if (!firstAnimation) {
       throw new Error('Unable to locate first animation');
     }
@@ -118,15 +118,15 @@ export class AnimationModel extends SDK.SDKModel.SDKModel<EventTypes> {
     const groupedAnimations = [firstAnimation];
     const groupStartTime = firstAnimation.startTime();
     const remainingAnimations = new Set<string>();
-    for (const id of this.pendingAnimations) {
-      const anim = (this.animationsById.get(id) as AnimationImpl);
+    for (const id of this.#pendingAnimations) {
+      const anim = (this.#animationsById.get(id) as AnimationImpl);
       if (anim.startTime() === groupStartTime) {
         groupedAnimations.push(anim);
       } else {
         remainingAnimations.add(id);
       }
     }
-    this.pendingAnimations = remainingAnimations;
+    this.#pendingAnimations = remainingAnimations;
     return new AnimationGroup(this, firstAnimationId, groupedAnimations);
   }
 
@@ -145,18 +145,18 @@ export class AnimationModel extends SDK.SDKModel.SDKModel<EventTypes> {
   }
 
   async resumeModel(): Promise<void> {
-    if (!this.enabled) {
+    if (!this.#enabled) {
       return;
     }
     await this.agent.invoke_enable();
   }
 
   async ensureEnabled(): Promise<void> {
-    if (this.enabled) {
+    if (this.#enabled) {
       return;
     }
     await this.agent.invoke_enable();
-    this.enabled = true;
+    this.#enabled = true;
   }
 }
 
@@ -173,15 +173,15 @@ export type EventTypes = {
 };
 
 export class AnimationImpl {
-  private readonly animationModel: AnimationModel;
-  private readonly payloadInternal: Protocol.Animation.Animation;
-  private sourceInternal: AnimationEffect;
-  private playStateInternal?: string;
+  readonly #animationModel: AnimationModel;
+  readonly #payloadInternal: Protocol.Animation.Animation;
+  #sourceInternal: AnimationEffect;
+  #playStateInternal?: string;
   constructor(animationModel: AnimationModel, payload: Protocol.Animation.Animation) {
-    this.animationModel = animationModel;
-    this.payloadInternal = payload;
-    this.sourceInternal =
-        new AnimationEffect(animationModel, (this.payloadInternal.source as Protocol.Animation.AnimationEffect));
+    this.#animationModel = animationModel;
+    this.#payloadInternal = payload;
+    this.#sourceInternal =
+        new AnimationEffect(animationModel, (this.#payloadInternal.source as Protocol.Animation.AnimationEffect));
   }
 
   static parsePayload(animationModel: AnimationModel, payload: Protocol.Animation.Animation): AnimationImpl {
@@ -189,35 +189,35 @@ export class AnimationImpl {
   }
 
   payload(): Protocol.Animation.Animation {
-    return this.payloadInternal;
+    return this.#payloadInternal;
   }
 
   id(): string {
-    return this.payloadInternal.id;
+    return this.#payloadInternal.id;
   }
 
   name(): string {
-    return this.payloadInternal.name;
+    return this.#payloadInternal.name;
   }
 
   paused(): boolean {
-    return this.payloadInternal.pausedState;
+    return this.#payloadInternal.pausedState;
   }
 
   playState(): string {
-    return this.playStateInternal || this.payloadInternal.playState;
+    return this.#playStateInternal || this.#payloadInternal.playState;
   }
 
   setPlayState(playState: string): void {
-    this.playStateInternal = playState;
+    this.#playStateInternal = playState;
   }
 
   playbackRate(): number {
-    return this.payloadInternal.playbackRate;
+    return this.#payloadInternal.playbackRate;
   }
 
   startTime(): number {
-    return this.payloadInternal.startTime;
+    return this.#payloadInternal.startTime;
   }
 
   endTime(): number {
@@ -234,15 +234,15 @@ export class AnimationImpl {
   }
 
   currentTime(): number {
-    return this.payloadInternal.currentTime;
+    return this.#payloadInternal.currentTime;
   }
 
   source(): AnimationEffect {
-    return this.sourceInternal;
+    return this.#sourceInternal;
   }
 
   type(): Protocol.Animation.AnimationType {
-    return this.payloadInternal.type;
+    return this.#payloadInternal.type;
   }
 
   overlaps(animation: AnimationImpl): boolean {
@@ -257,15 +257,15 @@ export class AnimationImpl {
   }
 
   setTiming(duration: number, delay: number): void {
-    this.sourceInternal.node().then(node => {
+    this.#sourceInternal.node().then(node => {
       if (!node) {
         throw new Error('Unable to find node');
       }
       this.updateNodeStyle(duration, delay, node);
     });
-    this.sourceInternal.durationInternal = duration;
-    this.sourceInternal.delayInternal = delay;
-    this.animationModel.agent.invoke_setTiming({animationId: this.id(), duration, delay});
+    this.#sourceInternal.durationInternal = duration;
+    this.#sourceInternal.delayInternal = delay;
+    this.#animationModel.agent.invoke_setTiming({animationId: this.id(), duration, delay});
   }
 
   private updateNodeStyle(duration: number, delay: number, node: SDK.DOMModel.DOMNode): void {
@@ -288,34 +288,34 @@ export class AnimationImpl {
   }
 
   async remoteObjectPromise(): Promise<SDK.RemoteObject.RemoteObject|null> {
-    const payload = await this.animationModel.agent.invoke_resolveAnimation({animationId: this.id()});
+    const payload = await this.#animationModel.agent.invoke_resolveAnimation({animationId: this.id()});
     if (!payload) {
       return null;
     }
 
-    return this.animationModel.runtimeModel.createRemoteObject(payload.remoteObject);
+    return this.#animationModel.runtimeModel.createRemoteObject(payload.remoteObject);
   }
 
   cssId(): string {
-    return this.payloadInternal.cssId || '';
+    return this.#payloadInternal.cssId || '';
   }
 }
 
 export class AnimationEffect {
-  private animationModel: AnimationModel;
-  private readonly payload: Protocol.Animation.AnimationEffect;
-  private readonly keyframesRuleInternal: KeyframesRule|undefined;
+  #animationModel: AnimationModel;
+  readonly #payload: Protocol.Animation.AnimationEffect;
+  readonly #keyframesRuleInternal: KeyframesRule|undefined;
   delayInternal: number;
   durationInternal: number;
-  private deferredNodeInternal?: SDK.DOMModel.DeferredDOMNode;
+  #deferredNodeInternal?: SDK.DOMModel.DeferredDOMNode;
   constructor(animationModel: AnimationModel, payload: Protocol.Animation.AnimationEffect) {
-    this.animationModel = animationModel;
-    this.payload = payload;
+    this.#animationModel = animationModel;
+    this.#payload = payload;
     if (payload.keyframesRule) {
-      this.keyframesRuleInternal = new KeyframesRule(payload.keyframesRule);
+      this.#keyframesRuleInternal = new KeyframesRule(payload.keyframesRule);
     }
-    this.delayInternal = this.payload.delay;
-    this.durationInternal = this.payload.duration;
+    this.delayInternal = this.#payload.delay;
+    this.durationInternal = this.#payload.duration;
   }
 
   delay(): number {
@@ -323,11 +323,11 @@ export class AnimationEffect {
   }
 
   endDelay(): number {
-    return this.payload.endDelay;
+    return this.#payload.endDelay;
   }
 
   iterationStart(): number {
-    return this.payload.iterationStart;
+    return this.#payload.iterationStart;
   }
 
   iterations(): number {
@@ -335,7 +335,7 @@ export class AnimationEffect {
     if (!this.delay() && !this.endDelay() && !this.duration()) {
       return 0;
     }
-    return this.payload.iterations || Infinity;
+    return this.#payload.iterations || Infinity;
   }
 
   duration(): number {
@@ -343,115 +343,116 @@ export class AnimationEffect {
   }
 
   direction(): string {
-    return this.payload.direction;
+    return this.#payload.direction;
   }
 
   fill(): string {
-    return this.payload.fill;
+    return this.#payload.fill;
   }
 
   node(): Promise<SDK.DOMModel.DOMNode|null> {
-    if (!this.deferredNodeInternal) {
-      this.deferredNodeInternal = new SDK.DOMModel.DeferredDOMNode(this.animationModel.target(), this.backendNodeId());
+    if (!this.#deferredNodeInternal) {
+      this.#deferredNodeInternal =
+          new SDK.DOMModel.DeferredDOMNode(this.#animationModel.target(), this.backendNodeId());
     }
-    return this.deferredNodeInternal.resolvePromise();
+    return this.#deferredNodeInternal.resolvePromise();
   }
 
   deferredNode(): SDK.DOMModel.DeferredDOMNode {
-    return new SDK.DOMModel.DeferredDOMNode(this.animationModel.target(), this.backendNodeId());
+    return new SDK.DOMModel.DeferredDOMNode(this.#animationModel.target(), this.backendNodeId());
   }
 
   backendNodeId(): Protocol.DOM.BackendNodeId {
-    return this.payload.backendNodeId as Protocol.DOM.BackendNodeId;
+    return this.#payload.backendNodeId as Protocol.DOM.BackendNodeId;
   }
 
   keyframesRule(): KeyframesRule|null {
-    return this.keyframesRuleInternal || null;
+    return this.#keyframesRuleInternal || null;
   }
 
   easing(): string {
-    return this.payload.easing;
+    return this.#payload.easing;
   }
 }
 
 export class KeyframesRule {
-  private readonly payload: Protocol.Animation.KeyframesRule;
-  private keyframesInternal: KeyframeStyle[];
+  readonly #payload: Protocol.Animation.KeyframesRule;
+  #keyframesInternal: KeyframeStyle[];
   constructor(payload: Protocol.Animation.KeyframesRule) {
-    this.payload = payload;
-    this.keyframesInternal = this.payload.keyframes.map(function(keyframeStyle) {
+    this.#payload = payload;
+    this.#keyframesInternal = this.#payload.keyframes.map(function(keyframeStyle) {
       return new KeyframeStyle(keyframeStyle);
     });
   }
 
   private setKeyframesPayload(payload: Protocol.Animation.KeyframeStyle[]): void {
-    this.keyframesInternal = payload.map(function(keyframeStyle) {
+    this.#keyframesInternal = payload.map(function(keyframeStyle) {
       return new KeyframeStyle(keyframeStyle);
     });
   }
 
   name(): string|undefined {
-    return this.payload.name;
+    return this.#payload.name;
   }
 
   keyframes(): KeyframeStyle[] {
-    return this.keyframesInternal;
+    return this.#keyframesInternal;
   }
 }
 
 export class KeyframeStyle {
-  private readonly payload: Protocol.Animation.KeyframeStyle;
-  private offsetInternal: string;
+  readonly #payload: Protocol.Animation.KeyframeStyle;
+  #offsetInternal: string;
   constructor(payload: Protocol.Animation.KeyframeStyle) {
-    this.payload = payload;
-    this.offsetInternal = this.payload.offset;
+    this.#payload = payload;
+    this.#offsetInternal = this.#payload.offset;
   }
 
   offset(): string {
-    return this.offsetInternal;
+    return this.#offsetInternal;
   }
 
   setOffset(offset: number): void {
-    this.offsetInternal = offset * 100 + '%';
+    this.#offsetInternal = offset * 100 + '%';
   }
 
   offsetAsNumber(): number {
-    return parseFloat(this.offsetInternal) / 100;
+    return parseFloat(this.#offsetInternal) / 100;
   }
 
   easing(): string {
-    return this.payload.easing;
+    return this.#payload.easing;
   }
 }
 
 export class AnimationGroup {
-  private readonly animationModel: AnimationModel;
-  private readonly idInternal: string;
-  private animationsInternal: AnimationImpl[];
-  private pausedInternal: boolean;
+  readonly #animationModel: AnimationModel;
+  readonly #idInternal: string;
+  #animationsInternal: AnimationImpl[];
+  #pausedInternal: boolean;
   screenshotsInternal: string[];
-  private readonly screenshotImages: HTMLImageElement[];
+  readonly #screenshotImages: HTMLImageElement[];
   constructor(animationModel: AnimationModel, id: string, animations: AnimationImpl[]) {
-    this.animationModel = animationModel;
-    this.idInternal = id;
-    this.animationsInternal = animations;
-    this.pausedInternal = false;
+    this.#animationModel = animationModel;
+    this.#idInternal = id;
+    this.#animationsInternal = animations;
+    this.#pausedInternal = false;
     this.screenshotsInternal = [];
 
-    this.screenshotImages = [];
+    this.#screenshotImages = [];
   }
 
   id(): string {
-    return this.idInternal;
+    return this.#idInternal;
   }
 
   animations(): AnimationImpl[] {
-    return this.animationsInternal;
+    return this.#animationsInternal;
   }
 
   release(): void {
-    this.animationModel.animationGroups.delete(this.id());
-    this.animationModel.releaseAnimations(this.animationIds());
+    this.#animationModel.animationGroups.delete(this.id());
+    this.#animationModel.releaseAnimations(this.animationIds());
   }
 
   private animationIds(): string[] {
@@ -459,40 +460,40 @@ export class AnimationGroup {
       return animation.id();
     }
 
-    return this.animationsInternal.map(extractId);
+    return this.#animationsInternal.map(extractId);
   }
 
   startTime(): number {
-    return this.animationsInternal[0].startTime();
+    return this.#animationsInternal[0].startTime();
   }
 
   finiteDuration(): number {
     let maxDuration = 0;
-    for (let i = 0; i < this.animationsInternal.length; ++i) {
-      maxDuration = Math.max(maxDuration, this.animationsInternal[i].finiteDuration());
+    for (let i = 0; i < this.#animationsInternal.length; ++i) {
+      maxDuration = Math.max(maxDuration, this.#animationsInternal[i].finiteDuration());
     }
     return maxDuration;
   }
 
   seekTo(currentTime: number): void {
-    this.animationModel.agent.invoke_seekAnimations({animations: this.animationIds(), currentTime});
+    this.#animationModel.agent.invoke_seekAnimations({animations: this.animationIds(), currentTime});
   }
 
   paused(): boolean {
-    return this.pausedInternal;
+    return this.#pausedInternal;
   }
 
   togglePause(paused: boolean): void {
-    if (paused === this.pausedInternal) {
+    if (paused === this.#pausedInternal) {
       return;
     }
-    this.pausedInternal = paused;
-    this.animationModel.agent.invoke_setPaused({animations: this.animationIds(), paused});
+    this.#pausedInternal = paused;
+    this.#animationModel.agent.invoke_setPaused({animations: this.animationIds(), paused});
   }
 
   currentTimePromise(): Promise<number> {
     let longestAnim: AnimationImpl|null = null;
-    for (const anim of this.animationsInternal) {
+    for (const anim of this.#animationsInternal) {
       if (!longestAnim || anim.endTime() > longestAnim.endTime()) {
         longestAnim = anim;
       }
@@ -501,7 +502,7 @@ export class AnimationGroup {
       throw new Error('No longest animation found');
     }
 
-    return this.animationModel.agent.invoke_getCurrentTime({id: longestAnim.id()})
+    return this.#animationModel.agent.invoke_getCurrentTime({id: longestAnim.id()})
         .then(({currentTime}) => currentTime || 0);
   }
 
@@ -513,11 +514,11 @@ export class AnimationGroup {
       return anim.cssId();
     }
 
-    if (this.animationsInternal.length !== group.animationsInternal.length) {
+    if (this.#animationsInternal.length !== group.#animationsInternal.length) {
       return false;
     }
-    const left = this.animationsInternal.map(extractId).sort();
-    const right = group.animationsInternal.map(extractId).sort();
+    const left = this.#animationsInternal.map(extractId).sort();
+    const right = group.#animationsInternal.map(extractId).sort();
     for (let i = 0; i < left.length; i++) {
       if (left[i] !== right[i]) {
         return false;
@@ -527,70 +528,70 @@ export class AnimationGroup {
   }
 
   update(group: AnimationGroup): void {
-    this.animationModel.releaseAnimations(this.animationIds());
-    this.animationsInternal = group.animationsInternal;
+    this.#animationModel.releaseAnimations(this.animationIds());
+    this.#animationsInternal = group.#animationsInternal;
   }
 
   screenshots(): HTMLImageElement[] {
     for (let i = 0; i < this.screenshotsInternal.length; ++i) {
       const image = new Image();
       image.src = 'data:image/jpeg;base64,' + this.screenshotsInternal[i];
-      this.screenshotImages.push(image);
+      this.#screenshotImages.push(image);
     }
     this.screenshotsInternal = [];
-    return this.screenshotImages;
+    return this.#screenshotImages;
   }
 }
 
 export class AnimationDispatcher implements ProtocolProxyApi.AnimationDispatcher {
-  private readonly animationModel: AnimationModel;
+  readonly #animationModel: AnimationModel;
   constructor(animationModel: AnimationModel) {
-    this.animationModel = animationModel;
+    this.#animationModel = animationModel;
   }
 
   animationCreated({id}: Protocol.Animation.AnimationCreatedEvent): void {
-    this.animationModel.animationCreated(id);
+    this.#animationModel.animationCreated(id);
   }
 
   animationCanceled({id}: Protocol.Animation.AnimationCanceledEvent): void {
-    this.animationModel.animationCanceled(id);
+    this.#animationModel.animationCanceled(id);
   }
 
   animationStarted({animation}: Protocol.Animation.AnimationStartedEvent): void {
-    this.animationModel.animationStarted(animation);
+    this.#animationModel.animationStarted(animation);
   }
 }
 
 export class ScreenshotCapture {
-  private requests: Request[];
-  private readonly screenCaptureModel: SDK.ScreenCaptureModel.ScreenCaptureModel;
-  private readonly animationModel: AnimationModel;
-  private stopTimer?: number;
-  private endTime?: number;
-  private capturing?: boolean;
+  #requests: Request[];
+  readonly #screenCaptureModel: SDK.ScreenCaptureModel.ScreenCaptureModel;
+  readonly #animationModel: AnimationModel;
+  #stopTimer?: number;
+  #endTime?: number;
+  #capturing?: boolean;
   constructor(animationModel: AnimationModel, screenCaptureModel: SDK.ScreenCaptureModel.ScreenCaptureModel) {
-    this.requests = [];
-    this.screenCaptureModel = screenCaptureModel;
-    this.animationModel = animationModel;
-    this.animationModel.addEventListener(Events.ModelReset, this.stopScreencast, this);
+    this.#requests = [];
+    this.#screenCaptureModel = screenCaptureModel;
+    this.#animationModel = animationModel;
+    this.#animationModel.addEventListener(Events.ModelReset, this.stopScreencast, this);
   }
 
   captureScreenshots(duration: number, screenshots: string[]): void {
-    const screencastDuration = Math.min(duration / this.animationModel.playbackRate, 3000);
+    const screencastDuration = Math.min(duration / this.#animationModel.playbackRate, 3000);
     const endTime = screencastDuration + window.performance.now();
-    this.requests.push({endTime: endTime, screenshots: screenshots});
+    this.#requests.push({endTime: endTime, screenshots: screenshots});
 
-    if (!this.endTime || endTime > this.endTime) {
-      clearTimeout(this.stopTimer);
-      this.stopTimer = window.setTimeout(this.stopScreencast.bind(this), screencastDuration);
-      this.endTime = endTime;
+    if (!this.#endTime || endTime > this.#endTime) {
+      clearTimeout(this.#stopTimer);
+      this.#stopTimer = window.setTimeout(this.stopScreencast.bind(this), screencastDuration);
+      this.#endTime = endTime;
     }
 
-    if (this.capturing) {
+    if (this.#capturing) {
       return;
     }
-    this.capturing = true;
-    this.screenCaptureModel.startScreencast(
+    this.#capturing = true;
+    this.#screenCaptureModel.startScreencast(
         Protocol.Page.StartScreencastRequestFormat.Jpeg, 80, undefined, 300, 2, this.screencastFrame.bind(this),
         _visible => {});
   }
@@ -600,27 +601,27 @@ export class ScreenshotCapture {
       return request.endTime >= now;
     }
 
-    if (!this.capturing) {
+    if (!this.#capturing) {
       return;
     }
 
     const now = window.performance.now();
-    this.requests = this.requests.filter(isAnimating);
-    for (const request of this.requests) {
+    this.#requests = this.#requests.filter(isAnimating);
+    for (const request of this.#requests) {
       request.screenshots.push(base64Data);
     }
   }
 
   private stopScreencast(): void {
-    if (!this.capturing) {
+    if (!this.#capturing) {
       return;
     }
 
-    delete this.stopTimer;
-    delete this.endTime;
-    this.requests = [];
-    this.capturing = false;
-    this.screenCaptureModel.stopScreencast();
+    this.#stopTimer = undefined;
+    this.#endTime = undefined;
+    this.#requests = [];
+    this.#capturing = false;
+    this.#screenCaptureModel.stopScreencast();
   }
 }