Rename `Element` => `LayoutElement` in LayoutPane
`Element` clashes with the TypeScript built-in and the bridge generation
gets confused now we have code to tell it that `Element` is a built-in
type.
I will work on a CL that errors when generating these bridges so that
this is spotted.
Change-Id: Ie6cb79bed29803728277233b4eb7ea53a8ff7af8
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2362568
Commit-Queue: Jack Franklin <[email protected]>
Reviewed-by: Alex Rudenko <[email protected]>
Auto-Submit: Jack Franklin <[email protected]>
diff --git a/front_end/elements/LayoutPane.ts b/front_end/elements/LayoutPane.ts
index 800a6e8..7208443 100644
--- a/front_end/elements/LayoutPane.ts
+++ b/front_end/elements/LayoutPane.ts
@@ -6,7 +6,7 @@
import * as ComponentHelpers from '../component_helpers/component_helpers.js';
import * as LitHtml from '../third_party/lit-html/lit-html.js';
-import {BooleanSetting, Element, EnumSetting, Setting, SettingType} from './LayoutPaneUtils.js';
+import {BooleanSetting, EnumSetting, LayoutElement, Setting, SettingType} from './LayoutPaneUtils.js';
const {render, html} = LitHtml;
const ls = Common.ls;
@@ -55,7 +55,7 @@
export class LayoutPane extends HTMLElement {
private readonly shadow = this.attachShadow({mode: 'open'});
private settings: Readonly<Setting[]> = [];
- private gridElements: Readonly<Element[]> = [];
+ private gridElements: Readonly<LayoutElement[]> = [];
constructor() {
super();
@@ -65,7 +65,7 @@
];
}
- set data(data: {settings: Setting[], gridElements: Element[]}) {
+ set data(data: {settings: Setting[], gridElements: LayoutElement[]}) {
this.settings = data.settings;
this.gridElements = data.gridElements;
this.render();
@@ -210,17 +210,17 @@
this.dispatchEvent(new SettingChangedEvent(setting.name, event.target.value));
}
- private onElementToggle(element: Element, event: HTMLInputElementEvent) {
+ private onElementToggle(element: LayoutElement, event: HTMLInputElementEvent) {
event.preventDefault();
this.dispatchEvent(new OverlayChangedEvent(element.id, event.target.checked));
}
- private onElementClick(element: Element, event: HTMLInputElementEvent) {
+ private onElementClick(element: LayoutElement, event: HTMLInputElementEvent) {
event.preventDefault();
this.dispatchEvent(new ElementClickedEvent(element.id));
}
- private renderElement(element: Element) {
+ private renderElement(element: LayoutElement) {
const name = this.buildElementName(element);
const onElementToggle = this.onElementToggle.bind(this, element);
const onElementClick = this.onElementClick.bind(this, element);
@@ -234,7 +234,7 @@
</div>`;
}
- private buildElementName(element: Element) {
+ private buildElementName(element: LayoutElement) {
const parts = [element.name];
if (element.domId) {
parts.push(`#${CSS.escape(element.domId)}`);
diff --git a/front_end/elements/LayoutPaneUtils.ts b/front_end/elements/LayoutPaneUtils.ts
index 2e1fd15..40fdd7e 100644
--- a/front_end/elements/LayoutPaneUtils.ts
+++ b/front_end/elements/LayoutPaneUtils.ts
@@ -28,7 +28,7 @@
export type EnumSetting = BaseSetting&{options: EnumSettingOption[], value: string};
export type Setting = EnumSetting|BooleanSetting;
-export interface Element {
+export interface LayoutElement {
id: number;
name: string;
domId?: string;
diff --git a/front_end/elements/LayoutPane_bridge.js b/front_end/elements/LayoutPane_bridge.js
index 6d8a556..b93f22b 100644
--- a/front_end/elements/LayoutPane_bridge.js
+++ b/front_end/elements/LayoutPane_bridge.js
@@ -25,7 +25,7 @@
* }}
*/
// @ts-ignore we export this for Closure not TS
-export let Element;
+export let LayoutElement;
/**
* @typedef {{
* name:string,
@@ -75,7 +75,7 @@
// eslint-disable-next-line no-unused-vars
export class LayoutPaneClosureInterface extends HTMLElement {
/**
- * @param {{settings: !Array.<!Setting>, gridElements: !Array.<!Element>}} data
+ * @param {{settings: !Array.<!Setting>, gridElements: !Array.<!LayoutElement>}} data
*/
set data(data) {
}
diff --git a/front_end/elements/LayoutSidebarPane.js b/front_end/elements/LayoutSidebarPane.js
index 49d7085..24bc115 100644
--- a/front_end/elements/LayoutSidebarPane.js
+++ b/front_end/elements/LayoutSidebarPane.js
@@ -10,11 +10,11 @@
import * as UI from '../ui/ui.js';
import {ElementsPanel} from './ElementsPanel.js';
-import {createLayoutPane, Element} from './LayoutPane_bridge.js'; // eslint-disable-line no-unused-vars
+import {createLayoutPane, LayoutElement} from './LayoutPane_bridge.js'; // eslint-disable-line no-unused-vars
/**
* @param {!Array<!SDK.DOMModel.DOMNode>} nodes
- * @return {!Array<!Element>}
+ * @return {!Array<!LayoutElement>}
*/
const gridNodesToElements = nodes => {
return nodes.map(node => {
