@salesforcedevs/arch-components 1.20.17-alpha2 → 1.20.17-alpha4

package/src/modules/shared/color/color.ts

@@ -2,11 +2,11 @@ export function hexToRGB(h: string) {
     let r = 0;
     let g = 0;
     let b = 0;
-    if (h.length == 4) {
+    if (h.length === 4) {
         r = +('0x' + h[1] + h[1]);
         g = +('0x' + h[2] + h[2]);
         b = +('0x' + h[3] + h[3]);
-    } else if (h.length == 7) {
+    } else if (h.length === 7) {
         r = +('0x' + h[1] + h[2]);
         g = +('0x' + h[3] + h[4]);
         b = +('0x' + h[5] + h[6]);
@@ -18,20 +18,20 @@ export function RGBToHSL(r: number, g: number, b: number) {
     r /= 255;
     g /= 255;
     b /= 255;
-    let cmin = Math.min(r, g, b);
-    let cmax = Math.max(r, g, b);
-    let delta = cmax - cmin;
+    const cmin = Math.min(r, g, b);
+    const cmax = Math.max(r, g, b);
+    const delta = cmax - cmin;
     let h = 0;
     let s = 0;
     let l = 0;
-    if (delta === 0) h = 0;
-    else if (cmax === r) h = ((g - b) / delta) % 6;
-    else if (cmax === g) h = (b - r) / delta + 2;
-    else h = (r - g) / delta + 4;
+    if (delta === 0) {h = 0;}
+    else if (cmax === r) {h = ((g - b) / delta) % 6;}
+    else if (cmax === g) {h = (b - r) / delta + 2;}
+    else {h = (r - g) / delta + 4;}
     h = Math.round(h * 60);
-    if (h < 0) h += 360;
+    if (h < 0) {h += 360;}
     l = (cmax + cmin) / 2;
-    s = delta == 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
+    s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
     s = +s.toFixed(1);
     l = +l.toFixed(1);
     return [h, s, l];
@@ -46,7 +46,7 @@ export function hsl(h: number, s: number, l: number) {
 }
 
 export function lightenHex(hex: string, by: number) {
-    let [r, g, b] = hexToRGB(hex);
-    let [h, s, l] = RGBToHSL(r, g, b);
+    const [r, g, b] = hexToRGB(hex);
+    const [h, s, l] = RGBToHSL(r, g, b);
     return hsl(h, s, l + by);
 }

package/src/modules/shared/fetch/fetch.ts

@@ -4,7 +4,7 @@ export function csrfHeader(token: string = '') {
     };
 }
 
-export function fetch(url: string, { ...options }: RequestInit = {}) {
+export function fetch(url: string, { ...options }: globalThis.RequestInit = {}) {
     return window.fetch(url, {
         ...options,
         credentials: 'same-origin'
@@ -13,7 +13,7 @@ export function fetch(url: string, { ...options }: RequestInit = {}) {
 
 export function fetchJSON<T>(
     url: string,
-    { headers, ...options }: RequestInit = {}
+    { headers, ...options }: globalThis.RequestInit = {}
 ) {
     return fetch(url, {
         ...options,
@@ -22,11 +22,11 @@ export function fetchJSON<T>(
             Accept: 'application/json; charset=utf-8'
         }
     }).then(async (response) => {
-        if (response.ok) return response.json() as Promise<T>;
+        if (response.ok) {return response.json() as Promise<T>;}
         if (/json/.test(String(response.headers.get('Content-Type'))))
-            return response
+            {return response
                 .json()
-                .then((errorJSON) => Promise.reject(errorJSON));
+                .then((errorJSON) => Promise.reject(errorJSON));}
         throw new Error(
             `Application error code ${response.status} for "${url}"`
         );
@@ -38,7 +38,7 @@ export { fetchJSON as getJSON };
 export function postJSON<T>(
     url: string,
     body?: object,
-    { headers, method = 'POST', ...options }: RequestInit = {}
+    { headers, method = 'POST', ...options }: globalThis.RequestInit = {}
 ) {
     return fetchJSON<T>(url, {
         ...options,

package/src/modules/shared/helpers/helpers.ts

@@ -9,13 +9,13 @@ export function attrToBool(attr: any) {
 }
 
 export function hash(value: string) {
-    let hash = 0;
+    let hashValue = 0;
     for (let i = 0; i < value.length; i++) {
-        let char = value.charCodeAt(i);
-        hash = (hash << 5) - hash + char;
-        hash |= 0;
+        const char = value.charCodeAt(i);
+        hashValue = (hashValue << 5) - hashValue + char;
+        hashValue |= 0;
     }
-    return hash;
+    return hashValue;
 }
 
 export function createImageUrl(image: string, hash: string) {
@@ -50,7 +50,7 @@ export function sendInteractionEvent(name: string, type: string, event: any, tar
     let text: string = '';
     let eventValue: string = '';
     let channelAction: string = '';
-    let channelActionStatus: string = channelActionsStatus.SUCCESS;
+    const channelActionStatus: string = channelActionsStatus.SUCCESS;
     const pageUrl = new URL(document.location.href);
     const searchTitle = pageUrl.searchParams.get('keywords') || '';
     if (

package/src/modules/shared/i18n/i18n.ts

@@ -43,7 +43,7 @@ export class I18n {
     private id = guid++;
 
     constructor(scope?: Scope) {
-        if (scope) this.addScope(scope);
+        if (scope) {this.addScope(scope);}
     }
 
     t(

package/src/modules/shared/labels/__tests__/helpers.test.ts

@@ -20,7 +20,7 @@ const dict: LabelsDict = {
 
 describe('label', () => {
     describe('default language', () => {
-        let lang = 'en';
+        const lang = 'en';
 
         describe('known keys', () => {
             it('finds key and returns the value', () => {
@@ -52,7 +52,7 @@ describe('label', () => {
     });
 
     describe('language with region', () => {
-        let lang = 'es-MX';
+        const lang = 'es-MX';
 
         describe('known keys', () => {
             it('finds key and returns the value', () => {
@@ -86,7 +86,7 @@ describe('label', () => {
     });
 
     describe('language not found', () => {
-        let lang = 'de';
+        const lang = 'de';
 
         describe('fallbacks', () => {
             it('fails to find key and falls back to english', () => {

package/src/modules/shared/labels/__tests__/pointHelpers.test.ts

@@ -2,7 +2,7 @@ import { pointLabel } from '../pointHelpers';
 
 describe('pointLabel', () => {
     describe('en', () => {
-        let lang = 'en';
+        const lang = 'en';
 
         it('returns correct values', () => {
             expect(pointLabel(lang, 0)).toEqual('0 Points');
@@ -12,7 +12,7 @@ describe('pointLabel', () => {
     });
 
     describe('es-MX', () => {
-        let lang = 'es-MX';
+        const lang = 'es-MX';
 
         it('returns correct values', () => {
             expect(pointLabel(lang, 0)).toEqual('0 puntos');
@@ -22,7 +22,7 @@ describe('pointLabel', () => {
     });
 
     describe('fj', () => {
-        let lang = 'fj';
+        const lang = 'fj';
 
         it('returns correct values', () => {
             expect(pointLabel(lang, 0)).toEqual('0 Points');

package/src/modules/shared/labels/__tests__/timeHelpers.test.ts

@@ -1,10 +1,10 @@
 import { hoursMinutesLabel, hoursMinutesLeftLabel } from '../timeHelpers';
 
 describe('hoursMinutesLabel', () => {
-    let subject = hoursMinutesLabel;
+    const subject = hoursMinutesLabel;
 
     describe('en', () => {
-        let lang = 'en';
+        const lang = 'en';
 
         it('returns correct values', () => {
             expect(subject(lang, 0)).toEqual('');
@@ -20,7 +20,7 @@ describe('hoursMinutesLabel', () => {
     });
 
     describe('es-MX', () => {
-        let lang = 'es-MX';
+        const lang = 'es-MX';
 
         it('falls back to es', () => {
             expect(subject(lang, 0)).toEqual('');
@@ -36,7 +36,7 @@ describe('hoursMinutesLabel', () => {
     });
 
     describe('fj', () => {
-        let lang = 'fj';
+        const lang = 'fj';
 
         it('falls back to en', () => {
             expect(subject(lang, 1)).toEqual('~1 min');
@@ -45,10 +45,10 @@ describe('hoursMinutesLabel', () => {
 });
 
 describe('hoursMinutesLeftLabel', () => {
-    let subject = hoursMinutesLeftLabel;
+    const subject = hoursMinutesLeftLabel;
 
     describe('en', () => {
-        let lang = 'en';
+        const lang = 'en';
 
         it('returns correct values', () => {
             expect(subject(lang, 0)).toEqual('');
@@ -64,7 +64,7 @@ describe('hoursMinutesLeftLabel', () => {
     });
 
     describe('es-MX', () => {
-        let lang = 'es-MX';
+        const lang = 'es-MX';
 
         it('falls back to es', () => {
             expect(subject(lang, 0)).toEqual('');
@@ -80,7 +80,7 @@ describe('hoursMinutesLeftLabel', () => {
     });
 
     describe('fj', () => {
-        let lang = 'fj';
+        const lang = 'fj';
 
         it('falls back to en', () => {
             expect(subject(lang, 1)).toEqual('~1 min left');

package/src/modules/shared/labels/helpers.ts

@@ -8,15 +8,15 @@ export function label(
     labelKey: string,
     values: (string | number)[] = []
 ): string {
-    let [langBase] = lang.split('-');
-    let labels = {
+    const [langBase] = lang.split('-');
+    const labels = {
         ...dict[DEFAULT_LANGUAGE],
         ...dict[langBase],
         ...dict[lang]
     };
     let str = labels[labelKey];
-    if (str === undefined) return labelKey;
-    for (let val of values) {
+    if (str === undefined) {return labelKey;}
+    for (const val of values) {
         str = str.replace('%{n}', val.toString());
     }
     return str;

package/src/modules/shared/labels/pointHelpers.ts

@@ -40,8 +40,8 @@ export function pointLabel(lang: string, points: number | undefined) {
             return label(lang, labels, 'zero', [points]);
         } else if (points === 1) {
             return label(lang, labels, 'one', [points]);
-        } else {
+        } 
             return label(lang, labels, 'many', [points]);
-        }
+        
     }
 }

package/src/modules/shared/labels/timeHelpers.ts

@@ -123,7 +123,7 @@ function hoursMinutesLabelArgs(timeInMinutes: number) {
     const mins = timeInMinutes % 60;
 
     let key = '';
-    let values = [];
+    const values = [];
 
     if (hrs > 0) {
         values.push(hrs);
@@ -166,7 +166,7 @@ function hoursMinutesLabelArgs(timeInMinutes: number) {
 }
 
 export function hoursMinutesLabel(lang: string, timeInMinutes: number) {
-    let labelInfo = hoursMinutesLabelArgs(timeInMinutes);
+    const labelInfo = hoursMinutesLabelArgs(timeInMinutes);
 
     return timeInMinutes
         ? label(lang, labels, `${labelInfo.key}`, labelInfo.values)
@@ -174,7 +174,7 @@ export function hoursMinutesLabel(lang: string, timeInMinutes: number) {
 }
 
 export function hoursMinutesLeftLabel(lang: string, timeInMinutes: number) {
-    let labelInfo = hoursMinutesLabelArgs(timeInMinutes);
+    const labelInfo = hoursMinutesLabelArgs(timeInMinutes);
 
     return timeInMinutes
         ? label(lang, labels, `${labelInfo.key}Left`, labelInfo.values)

package/src/modules/shared/menu/menu.ts

@@ -49,7 +49,7 @@ export class Menu {
             | Partial<MenuState>
             | ((state: MenuState) => Partial<MenuState>)
     ) {
-        let { state } = this;
+        const { state } = this;
         this.state = {
             ...state,
             ...(typeof nextState === 'function' ? nextState(state) : nextState)
@@ -58,8 +58,8 @@ export class Menu {
 
     renderedCallback() {
         if (!this.state.setup) {
-            let $trigger = this.getElement(SELECTOR_TRIGGER)!;
-            let $menu = this.getElement(SELECTOR_MENU)!;
+            const $trigger = this.getElement(SELECTOR_TRIGGER)!;
+            const $menu = this.getElement(SELECTOR_MENU)!;
             $trigger.addEventListener('click', this.onTriggerClick as EventListener);
             $trigger.addEventListener('keydown', this.onTriggerKeyDown as EventListener);
             $menu.addEventListener('blur', this.onMenuBlur as EventListener);
@@ -78,8 +78,8 @@ export class Menu {
     }
 
     disconnectedCallback() {
-        let $trigger = this.getElement(SELECTOR_TRIGGER)!;
-        let $menu = this.getElement(SELECTOR_MENU)!;
+        const $trigger = this.getElement(SELECTOR_TRIGGER)!;
+        const $menu = this.getElement(SELECTOR_MENU)!;
         $trigger.removeEventListener('click', this.onTriggerClick as EventListener);
         $trigger.removeEventListener('keydown', this.onTriggerKeyDown as EventListener);
         $menu.removeEventListener('blur', this.onMenuBlur as EventListener);
@@ -106,8 +106,8 @@ export class Menu {
     }
 
     private onTriggerClick = (e: MouseEvent) => {
-        if (this.state.open) this.close();
-        else this.open();
+        if (this.state.open) {this.close();}
+        else {this.open();}
     };
 
     private onTriggerKeyDown = (e: KeyboardEvent) => {
@@ -124,9 +124,9 @@ export class Menu {
 
     private onMenuBlur = (e: FocusEvent) => {
         setTimeout(() => {
-            let $active = this.input.shadowRoot.activeElement;
-            let $menu = this.getElement(SELECTOR_MENU)!;
-            if ($menu === $active || $menu.contains($active)) return;
+            const $active = this.input.shadowRoot.activeElement;
+            const $menu = this.getElement(SELECTOR_MENU)!;
+            if ($menu === $active || $menu.contains($active)) {return;}
             this.setState({ open: false });
         });
     };
@@ -137,7 +137,7 @@ export class Menu {
                 this.setState((state) => {
                     let { selectedIndex } = state;
                     selectedIndex--;
-                    if (selectedIndex < 0) selectedIndex = state.count - 1;
+                    if (selectedIndex < 0) {selectedIndex = state.count - 1;}
                     return { selectedIndex };
                 });
                 break;
@@ -145,12 +145,12 @@ export class Menu {
                 this.setState((state) => {
                     let { selectedIndex } = state;
                     selectedIndex++;
-                    if (selectedIndex === state.count) selectedIndex = 0;
+                    if (selectedIndex === state.count) {selectedIndex = 0;}
                     return { selectedIndex };
                 });
                 break;
             case 'Enter':
-                if (!this.state.open) break;
+                if (!this.state.open) {break;}
                 this.close();
                 this.select();
                 break;
@@ -167,18 +167,18 @@ export class Menu {
     };
 
     private select() {
-        let element = this.input.shadowRoot.querySelectorAll(
+        const element = this.input.shadowRoot.querySelectorAll(
             getSelector(SELECTOR_ITEM)
         )[this.state.selectedIndex] as HTMLElement | undefined;
-        if (element) element.click();
+        if (element) {element.click();}
     }
 
     private setTriggerAttributes() {
         if (!this.state.setup) {
             return;
         }
-        let $trigger = this.getElement(SELECTOR_TRIGGER)!;
-        let $menu = this.getElement(SELECTOR_MENU)!;
+        const $trigger = this.getElement(SELECTOR_TRIGGER)!;
+        const $menu = this.getElement(SELECTOR_MENU)!;
         $trigger.setAttribute('aria-controls', $menu.getAttribute('id') || '');
         $trigger.setAttribute('aria-expanded', String(this.state.open));
         $trigger.setAttribute('aria-haspopup', 'true');
@@ -190,8 +190,8 @@ export class Menu {
             return;
         }
 
-        let $menu = this.getElement(SELECTOR_MENU)!;
-        let $activeDecendant = this.input.shadowRoot.querySelectorAll(
+        const $menu = this.getElement(SELECTOR_MENU)!;
+        const $activeDecendant = this.input.shadowRoot.querySelectorAll(
             getSelector(SELECTOR_ITEM)
         )[this.state.selectedIndex] as HTMLElement | undefined;
         $menu.setAttribute(
@@ -207,13 +207,13 @@ export class Menu {
             $menu.removeAttribute('tabindex');
         }
         this.input.shadowRoot.querySelectorAll('ui,li').forEach((node) => {
-            let element = node as HTMLElement;
+            const element = node as HTMLElement;
             element.setAttribute('role', 'presentation');
         });
         this.input.shadowRoot
             .querySelectorAll(getSelector(SELECTOR_ITEM))
             .forEach((node) => {
-                let element = node as HTMLElement;
+                const element = node as HTMLElement;
                 element.setAttribute('tabindex', '-1');
             });
     }
@@ -222,7 +222,7 @@ export class Menu {
         this.input.shadowRoot
             .querySelectorAll(getSelector(SELECTOR_ITEM))
             .forEach((node, i) => {
-                let element = node as HTMLElement;
+                const element = node as HTMLElement;
                 element.setAttribute(
                     'data-active',
                     String(i === this.state.selectedIndex)

package/src/modules/shared/polling-request.ts

@@ -74,7 +74,7 @@ export class PollingRequest<T> {
             const res = await this.request();
 
             // If polling was stopped before the request could complete
-            if (currentAttempt !== this.attempt) return;
+            if (currentAttempt !== this.attempt) {return;}
 
             if (this.done(res)) {
                 this.stop();
@@ -88,7 +88,7 @@ export class PollingRequest<T> {
             }
         } catch (err) {
             // If polling was stopped before the request could complete
-            if (currentAttempt !== this.attempt) return;
+            if (currentAttempt !== this.attempt) {return;}
 
             this.stop();
             this.reject(err);

package/src/modules/shared/testutils.ts

@@ -20,7 +20,7 @@ export function $testid(value: string, element: HTMLElement) {
 }
 
 export function renderIntoBody(template: TemplateResult) {
-    let element = document.createElement('div');
+    const element = document.createElement('div');
     document.body.append(element);
     render(template, element);
     return element.children[0] as HTMLElement;
@@ -35,10 +35,10 @@ export async function renderIntoBodyAndWait(
           }) => boolean)
         | string
 ) {
-    let element = renderIntoBody(template);
+    const element = renderIntoBody(template);
     await new Promise((resolve) => {
-        let check = () => {
-            let isReady =
+        const check = () => {
+            const isReady =
                 typeof ready === 'string'
                     ? querySelector(ready, element) !== null
                     : ready({ querySelector, querySelectorAll });

package/src/modules/shared/useEffectAttr.ts

@@ -1,15 +1,15 @@
 export function useEffectAttr(fn: Function, deps: Array<string>, context: any) {
-    let prevValues = new Map<string, any>();
+    const prevValues = new Map<string, any>();
     return () => {
-        let prev = deps.map((key) => prevValues.get(key));
-        let next = deps.map((key) => context[key]);
-        for (let i in prev) {
+        const prev = deps.map((key) => prevValues.get(key));
+        const next = deps.map((key) => context[key]);
+        for (const i in prev) {
             if (next[i] !== prev[i]) {
                 fn.call(context);
                 break;
             }
         }
-        for (let k of deps) {
+        for (const k of deps) {
             prevValues.set(k, context[k]);
         }
     };

package/src/modules/tds/appLauncher/__tests__/appLauncher.test.ts

@@ -41,7 +41,7 @@ describe('tds-app-launcher', () => {
     });
 
     it('opens the menu when the container is clicked', async () => {
-        let clickEvent = new MouseEvent('click', {
+        const clickEvent = new MouseEvent('click', {
             bubbles: false,
             cancelable: true
         });
@@ -60,7 +60,7 @@ describe('tds-app-launcher', () => {
     });
 
     it('render the label', () => {
-        let $button = querySelector(
+        const $button = querySelector(
             'tds-button-icon button',
             renderElement({ label: 'Fancy Apps' })
         )!;
@@ -68,8 +68,8 @@ describe('tds-app-launcher', () => {
     });
 
     it('renders each app', async () => {
-        let apps = [...mockApps];
-        let $items = shadow.querySelectorAll('.menu__item')!;
+        const apps = [...mockApps];
+        const $items = shadow.querySelectorAll('.menu__item')!;
         apps.forEach((app, index) => {
             expect($items[index].getAttribute('href')).toBe(app.link.href);
             expect($items[index].textContent).toBe(app.label);
@@ -81,11 +81,11 @@ describe('tds-app-launcher', () => {
 
     describe('tracking', () => {
         it('app_launcher_clicked', async () => {
-            let clickEvent = new MouseEvent('click', {
+            const clickEvent = new MouseEvent('click', {
                 bubbles: false,
                 cancelable: true
             });
-            let handler = jest.fn();
+            const handler = jest.fn();
             document.addEventListener('trailhead_track', handler);
             shadow
                 .querySelector('[data-menu="trigger"]')!
@@ -98,11 +98,11 @@ describe('tds-app-launcher', () => {
             );
         });
         it('app_launcher_link_clicked', async () => {
-            let clickEvent = new MouseEvent('click', {
+            const clickEvent = new MouseEvent('click', {
                 bubbles: false,
                 cancelable: true
             });
-            let handler = jest.fn();
+            const handler = jest.fn();
             document.addEventListener('trailhead_track', handler);
             shadow
                 .querySelector('[data-menu="item"]')!

package/src/modules/tds/appLauncher/appLauncher.ts

@@ -52,7 +52,7 @@ export default class extends LightningElement {
     }
 
     private onOptionClick(e: MouseEvent) {
-        let target = e.currentTarget as HTMLElement;
+        const target = e.currentTarget as HTMLElement;
         track(this.template.host, 'app_launcher_link_clicked', {
             label: this.menuOptions.find((o) => o.key === target.dataset.key)!
                 .label
@@ -60,16 +60,16 @@ export default class extends LightningElement {
     }
 
     private resizeMenu() {
-        let $menu = this.template.querySelector('.menu') as HTMLElement;
-        if (!$menu) return;
+        const $menu = this.template.querySelector('.menu') as HTMLElement;
+        if (!$menu) {return;}
         $menu.style.transform = '';
         $menu.style.width = '';
-        let rect = $menu.getBoundingClientRect();
-        let shouldResize = this.menuState.open && rect.x < 0;
+        const rect = $menu.getBoundingClientRect();
+        const shouldResize = this.menuState.open && rect.x < 0;
         $menu.style.width = shouldResize
             ? 'calc(100vw - var(--tds-spacing-2) * 2)'
             : '';
-        let rectResized = $menu.getBoundingClientRect();
+        const rectResized = $menu.getBoundingClientRect();
         $menu.style.transform = shouldResize
             ? `translate(calc(${Math.abs(
                   rectResized.x

package/src/modules/tds/avatar/__tests__/avatar.test.ts

@@ -6,6 +6,6 @@ customElements.define('tds-avatar', Avatar.CustomElementConstructor);
 
 describe('tds-avatar', () => {
     it('works', () => {
-        let element = renderIntoBody(html` <tds-avatar></tds-avatar> `);
+        const element = renderIntoBody(html` <tds-avatar></tds-avatar> `);
     });
 });

package/src/modules/tds/button/__tests__/button.test.ts

@@ -6,7 +6,7 @@ customElements.define('tds-button', Button.CustomElementConstructor);
 
 describe('tds-button', () => {
     it('reflects attributes', async () => {
-        let element = renderIntoBody(
+        const element = renderIntoBody(
             html` <tds-button aria-label="Hello"></tds-button> `
         );
         expect(element.shadowRoot!.querySelector('button')).toHaveAttribute(
@@ -16,7 +16,7 @@ describe('tds-button', () => {
     });
 
     it('can show a spinner', () => {
-        let element = renderIntoBody(
+        const element = renderIntoBody(
             html` <tds-button spinner>Creating...</tds-button> `
         );
 
@@ -24,7 +24,7 @@ describe('tds-button', () => {
     });
 
     it('applies size small class', async () => {
-        let element = renderIntoBody(
+        const element = renderIntoBody(
             html` <tds-button size="small"></tds-button> `
         );
         expect(
@@ -33,7 +33,7 @@ describe('tds-button', () => {
     });
 
     it('applies size large class', async () => {
-        let element = renderIntoBody(
+        const element = renderIntoBody(
             html` <tds-button size="large"></tds-button> `
         );
         expect(
@@ -42,7 +42,7 @@ describe('tds-button', () => {
     });
 
     it('does not apply invalid size class', async () => {
-        let element = renderIntoBody(
+        const element = renderIntoBody(
             html` <tds-button size="floogle"></tds-button> `
         );
         expect(

package/src/modules/tds/buttonIcon/__tests__/buttonIcon.test.ts

@@ -6,7 +6,7 @@ customElements.define('tds-button-icon', ButtonIcon.CustomElementConstructor);
 
 describe('tds-button-icon', () => {
     it('reflects attributes', async () => {
-        let element = renderIntoBody(
+        const element = renderIntoBody(
             html` <tds-button-icon aria-label="Hello"></tds-button-icon> `
         );
         expect(element.shadowRoot!.querySelector('button')).toHaveAttribute(