chrome-devtools-frontend 1.0.1575174 → 1.0.1575635

package/front_end/third_party/puppeteer/package/src/cdp/TargetManager.ts

@@ -7,7 +7,8 @@
 import type {Protocol} from 'devtools-protocol';
 
 import type {TargetFilterCallback} from '../api/Browser.js';
-import {CDPSession, CDPSessionEvent} from '../api/CDPSession.js';
+import type {CDPSession} from '../api/CDPSession.js';
+import {CDPSessionEvent} from '../api/CDPSession.js';
 import {EventEmitter} from '../common/EventEmitter.js';
 import {debugError} from '../common/util.js';
 import {assert} from '../util/assert.js';
@@ -196,15 +197,36 @@ export class TargetManager
       this.#attachedToTargetListenersBySession.delete(session);
     }
 
-    if (this.#detachedFromTargetListenersBySession.has(session)) {
-      session.off(
-        'Target.detachedFromTarget',
-        this.#detachedFromTargetListenersBySession.get(session)!,
-      );
+    const detachedListener =
+      this.#detachedFromTargetListenersBySession.get(session);
+    if (detachedListener) {
+      session.off('Target.detachedFromTarget', detachedListener);
       this.#detachedFromTargetListenersBySession.delete(session);
     }
   }
 
+  #silentDetach = async (
+    session: CdpCDPSession,
+    parentSession: Connection | CDPSession,
+  ): Promise<void> => {
+    await session.send('Runtime.runIfWaitingForDebugger').catch(debugError);
+    // We don't use `session.detach()` because that dispatches all commands on
+    // the connection instead of the parent session.
+    await parentSession
+      .send('Target.detachFromTarget', {
+        sessionId: session.id(),
+      })
+      .catch(debugError);
+  };
+
+  #getParentTarget = (
+    parentSession: Connection | CDPSession,
+  ): CdpTarget | null => {
+    return parentSession instanceof CdpCDPSession
+      ? parentSession.target()
+      : null;
+  };
+
   #onSessionDetached = (session: CDPSession) => {
     this.#removeAttachmentListeners(session);
   };
@@ -234,10 +256,7 @@ export class TargetManager
     const targetInfo = this.#discoveredTargetsByTargetId.get(event.targetId);
     this.#discoveredTargetsByTargetId.delete(event.targetId);
     this.#finishInitializationIfReady(event.targetId);
-    if (
-      targetInfo?.type === 'service_worker' &&
-      this.#attachedTargetsByTargetId.has(event.targetId)
-    ) {
+    if (targetInfo?.type === 'service_worker') {
       // Special case for service workers: report TargetGone event when
       // the worker is destroyed.
       const target = this.#attachedTargetsByTargetId.get(event.targetId);
@@ -256,7 +275,6 @@ export class TargetManager
 
     if (
       this.#ignoredTargets.has(event.targetInfo.targetId) ||
-      !this.#attachedTargetsByTargetId.has(event.targetInfo.targetId) ||
       !event.targetInfo.attached
     ) {
       return;
@@ -273,7 +291,7 @@ export class TargetManager
       target._initializedDeferred.value() === InitializationStatus.SUCCESS;
 
     if (isPageTargetBecomingPrimary(target, event.targetInfo)) {
-      const session = target?._session();
+      const session = target._session();
       assert(
         session,
         'Target that is being activated is missing a CDPSession.',
@@ -302,17 +320,6 @@ export class TargetManager
       throw new Error(`Session ${event.sessionId} was not created.`);
     }
 
-    const silentDetach = async () => {
-      await session.send('Runtime.runIfWaitingForDebugger').catch(debugError);
-      // We don't use `session.detach()` because that dispatches all commands on
-      // the connection instead of the parent session.
-      await parentSession
-        .send('Target.detachFromTarget', {
-          sessionId: session.id(),
-        })
-        .catch(debugError);
-    };
-
     if (!this.#connection.isAutoAttached(targetInfo.targetId)) {
       return;
     }
@@ -325,7 +332,7 @@ export class TargetManager
     // should determine if a target is auto-attached or not with the help of
     // CDP.
     if (targetInfo.type === 'service_worker') {
-      await silentDetach();
+      await this.#silentDetach(session, parentSession);
       if (this.#attachedTargetsByTargetId.has(targetInfo.targetId)) {
         return;
       }
@@ -336,27 +343,25 @@ export class TargetManager
       return;
     }
 
-    const isExistingTarget = this.#attachedTargetsByTargetId.has(
-      targetInfo.targetId,
-    );
+    let target = this.#attachedTargetsByTargetId.get(targetInfo.targetId);
+    const isExistingTarget = target !== undefined;
 
-    const target = isExistingTarget
-      ? this.#attachedTargetsByTargetId.get(targetInfo.targetId)!
-      : this.#targetFactory(
-          targetInfo,
-          session,
-          parentSession instanceof CdpCDPSession ? parentSession : undefined,
-        );
+    if (!target) {
+      target = this.#targetFactory(
+        targetInfo,
+        session,
+        parentSession instanceof CdpCDPSession ? parentSession : undefined,
+      );
+    }
 
-    const parentTarget =
-      parentSession instanceof CdpCDPSession ? parentSession.target() : null;
+    const parentTarget = this.#getParentTarget(parentSession);
 
     if (this.#targetFilterCallback && !this.#targetFilterCallback(target)) {
       this.#ignoredTargets.add(targetInfo.targetId);
       if (parentTarget?.type() === 'tab') {
         this.#finishInitializationIfReady(parentTarget._targetId);
       }
-      await silentDetach();
+      await this.#silentDetach(session, parentSession);
       return;
     }
 
@@ -372,10 +377,7 @@ export class TargetManager
 
     if (isExistingTarget) {
       session.setTarget(target);
-      this.#attachedTargetsBySessionId.set(
-        session.id(),
-        this.#attachedTargetsByTargetId.get(targetInfo.targetId)!,
-      );
+      this.#attachedTargetsBySessionId.set(session.id(), target);
     } else {
       target._initialize();
       this.#attachedTargetsByTargetId.set(targetInfo.targetId, target);
@@ -425,15 +427,14 @@ export class TargetManager
     event: Protocol.Target.DetachedFromTargetEvent,
   ) => {
     const target = this.#attachedTargetsBySessionId.get(event.sessionId);
-
     this.#attachedTargetsBySessionId.delete(event.sessionId);
 
     if (!target) {
       return;
     }
 
-    if (parentSession instanceof CDPSession) {
-      (parentSession as CdpCDPSession).target()._removeChildTarget(target);
+    if (parentSession instanceof CdpCDPSession) {
+      parentSession.target()._removeChildTarget(target);
     }
     this.#attachedTargetsByTargetId.delete(target._targetId);
     this.emit(TargetManagerEvent.TargetGone, target);

package/front_end/third_party/puppeteer/package/src/util/version.ts

@@ -6,5 +6,5 @@
 
 // If moved update release-please config
 // x-release-please-start-version
-export const packageVersion = '24.36.0';
+export const packageVersion = '24.36.1';
 // x-release-please-end

package/front_end/ui/components/buttons/Button.ts

@@ -117,7 +117,7 @@ export class Button extends HTMLElement {
     longClickable: false,
   };
   #internals = this.attachInternals();
-  #slotRef = Lit.Directives.createRef();
+  #slotRef = Lit.Directives.createRef<HTMLSlotElement>();
 
   constructor() {
     super();
@@ -326,7 +326,7 @@ export class Button extends HTMLElement {
   }
 
   #render(): void {
-    const nodes = (this.#slotRef.value as HTMLSlotElement | undefined)?.assignedNodes();
+    const nodes = this.#slotRef.value?.assignedNodes();
     const isEmpty = !Boolean(nodes?.length);
     if (!this.#props.variant) {
       throw new Error('Button requires a variant to be defined');

package/front_end/ui/components/panel_feedback/PreviewToggle.ts

@@ -3,8 +3,8 @@
 // found in the LICENSE file.
 /* eslint-disable @devtools/no-lit-render-outside-of-view, @devtools/enforce-custom-element-definitions-location */
 
-import '../../../ui/legacy/legacy.js';
 import '../../../ui/kit/kit.js';
+import '../../legacy/legacy.js';
 
 import * as i18n from '../../../core/i18n/i18n.js';
 import * as Root from '../../../core/root/root.js';

package/front_end/ui/components/panel_feedback/panelFeedback.css

@@ -59,7 +59,7 @@ devtools-link {
   text-decoration-line: underline;
 }
 
-x-link.quick-start-link {
+devtools-link.quick-start-link {
   font-size: 14px;
   line-height: 22px;
   letter-spacing: 0.04em;

package/front_end/ui/kit/link/Link.ts

@@ -133,6 +133,37 @@ export class Link extends HTMLElement {
     );
     // clang-format on
   }
+
+  /**
+   * Should be used only by old code relying on imperative API,
+   * which we are activly migrating away from.
+   * @deprecated
+   */
+  static create(
+      url: string,
+      linkText?: string,
+      className?: string,
+      jsLogContext?: string,
+      tabindex = 0,
+      ): Link {
+    const link = new Link();
+    link.href = url as Platform.DevToolsPath.UrlString;
+    linkText = linkText ?? url;
+    link.textContent = Platform.StringUtilities.trimMiddle(linkText, 150);
+
+    const classes = className ? `${className} devtools-link` : 'devtools-link';
+    link.setAttribute('class', classes);
+
+    if (jsLogContext) {
+      link.setAttribute('jslogcontext', jsLogContext);
+    }
+
+    if (tabindex !== 0) {
+      link.setAttribute('tabindex', String(tabindex));
+    }
+
+    return link;
+  }
 }
 
 customElements.define('devtools-link', Link);

package/front_end/ui/legacy/LinkContextMenuProvider.ts

@@ -11,23 +11,21 @@ import {
   copyLinkAddressLabel,
   openLinkExternallyLabel,
 } from './UIUtils.js';
-import {XLink} from './XLink.js';
 
 /**
  * We can move this next to the Link after
- * the x-link is removed and the context menu
- * is decoupled from the legacy bundle
+ * the context menu is decoupled from the legacy bundle
  */
 export class LinkContextMenuProvider implements Provider<Node> {
   appendApplicableItems(_event: Event, contextMenu: ContextMenu, target: Node): void {
     let targetNode: Node|null = target;
-    while (targetNode && !(targetNode instanceof XLink || targetNode instanceof Link)) {
+    while (targetNode && !(targetNode instanceof Link)) {
       targetNode = targetNode.parentNodeOrShadowHost();
     }
     if (!targetNode?.href) {
       return;
     }
-    const node: XLink|Link = targetNode;
+    const node: Link = targetNode;
     contextMenu.revealSection().appendItem(openLinkExternallyLabel(), () => {
       if (node.href) {
         UIHelpers.openInNewTab(node.href);

package/front_end/ui/legacy/components/object_ui/ObjectPopoverHelper.ts

@@ -8,6 +8,7 @@ import * as i18n from '../../../../core/i18n/i18n.js';
 import * as Platform from '../../../../core/platform/platform.js';
 import * as SDK from '../../../../core/sdk/sdk.js';
 import * as Geometry from '../../../../models/geometry/geometry.js';
+import {Link} from '../../../kit/kit.js';
 import {render} from '../../../lit/lit.js';
 import * as UI from '../../legacy.js';
 import * as Components from '../utils/utils.js';
@@ -109,8 +110,7 @@ export class ObjectPopoverHelper {
     descriptionDiv.dataset.stableNameForTest = 'object-popover-content';
     popover.registerRequiredCSS(objectPopoverStyles);
     descriptionDiv.textContent = description;
-    const learnMoreLink =
-        UI.XLink.XLink.create(link, i18nString(UIStrings.learnMore), undefined, undefined, 'learn-more');
+    const learnMoreLink = Link.create(link, i18nString(UIStrings.learnMore), undefined, 'learn-more');
     const footerDiv = document.createElement('div');
     footerDiv.classList.add('object-popover-footer');
     footerDiv.appendChild(learnMoreLink);