TypeError in input-time-zone setFocus()

[nwhittaker]

Check existing issues

• I have checked for existing issues to avoid duplicates

Actual Behavior

Encountering a consistent CI test failure where a TypeError is thrown when calling setFocus() on a <calcite-input-time-zone> element.

Expected Behavior

No TypeError and CI tests do not fail.

Reproduction Sample

https://github.com/ArcGIS/acadia-web

Reproduction Steps

The repo is private and there isn't an easy way to repro locally.

Reproduction Version

2.13.2

Relevant Info

Interestingly, failures are not reproducible when running CI tests locally (both in browser and headless) -- possibly indicating some sort of race condition.

Our tests have a helper that waits for the component to hydrate and then calls setFocus() on it before filling in a value. The stack trace shows the end of that chain after calling setFocus() on a <calcite-input-time-zone> element:

TypeError: Cannot read properties of undefined (reading 'setFocus')
    at U.setFocus (https://localhost:34029/calcite-components-2.13.2/p-f0abbe8c.entry.js:6:6800)
    …

The component's implementation forwards the setFocus call onto a combobox reference which does not appear to exist yet (or has gone away?). Either way, typing the comboboxEl property as optional would likely clear up the issue for us:

calcite-design-system/packages/calcite-components/src/components/input-time-zone/input-time-zone.tsx

Lines 283 to 287 in e38e297

	@Method()
	async setFocus(): Promise<void> {
	await componentFocusable(this);
	await this.comboboxEl.setFocus();
	}

Regression?

No response

Priority impact

impact - p2 - want for an upcoming milestone

Impact

A workaround is to stop calling setFocus() on the component during tests. However, this adds the risk of no longer exercising any focus-related logic.

Calcite package

• @esri/calcite-components
• @esri/calcite-components-react
• @esri/calcite-design-tokens
• @esri/calcite-ui-icons
• @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Field Apps