refactor: remove async modifier from willUpdate (#3223)

sbb-design-systems · Nov 21, 2024 · 30292e9 · 30292e9
1 parent dd8d644
commit 30292e9
Show file tree

Hide file tree

Showing 11 changed files with 14 additions and 21 deletions.
diff --git a/src/elements/checkbox/checkbox-panel/checkbox-panel.ts b/src/elements/checkbox/checkbox-panel/checkbox-panel.ts
@@ -73,7 +73,7 @@ class SbbCheckboxPanelElement extends SbbPanelMixin(
     { bubbles: true },
   );
 
-  protected override async willUpdate(changedProperties: PropertyValues<this>): Promise<void> {
+  protected override willUpdate(changedProperties: PropertyValues<this>): void {
     super.willUpdate(changedProperties);
 
     if (changedProperties.has('checked')) {

diff --git a/src/elements/checkbox/common/checkbox-common.ts b/src/elements/checkbox/common/checkbox-common.ts
@@ -49,7 +49,7 @@ export const SbbCheckboxCommonElementMixin = <T extends Constructor<LitElement>>
       ['disabled', 'required', 'size'].forEach((p) => this.requestUpdate(p));
     }
 
-    protected override async willUpdate(changedProperties: PropertyValues<this>): Promise<void> {
+    protected override willUpdate(changedProperties: PropertyValues<this>): void {
       super.willUpdate(changedProperties);
 
       if (changedProperties.has('checked') || changedProperties.has('indeterminate')) {

diff --git a/src/elements/clock/clock.ts b/src/elements/clock/clock.ts
@@ -87,11 +87,11 @@ class SbbClockElement extends LitElement {
   /** Callback function for minutes hand. */
   private _moveMinutesHandFn = (): void => this._moveMinutesHand();
 
-  protected override async willUpdate(changedProperties: PropertyValues<this>): Promise<void> {
+  protected override willUpdate(changedProperties: PropertyValues<this>): void {
     super.willUpdate(changedProperties);
 
     if (!isServer && changedProperties.has('now')) {
-      await this._startOrConfigureClock();
+      this._startOrConfigureClock();
     }
   }
 

diff --git a/src/elements/core/mixins/required-mixin.ts b/src/elements/core/mixins/required-mixin.ts
@@ -32,7 +32,7 @@ export const SbbRequiredMixin = <
     }
     private _required: boolean = false;
 
-    protected override async willUpdate(changedProperties: PropertyValues<this>): Promise<void> {
+    protected override willUpdate(changedProperties: PropertyValues<this>): void {
       super.willUpdate(changedProperties);
 
       if (changedProperties.has('required')) {

diff --git a/src/elements/datepicker/datepicker/datepicker.ts b/src/elements/datepicker/datepicker/datepicker.ts
@@ -148,7 +148,6 @@ export function isDateAvailable<T = Date>(
   min: string | number | null | undefined,
   max: string | number | null | undefined,
 ): boolean {
-  // TODO: Get date adapter from config
   const dateAdapter: DateAdapter<T> = readConfig().datetime?.dateAdapter ?? defaultDateAdapter;
   const dateMin = dateAdapter.deserialize(min);
   const dateMax = dateAdapter.deserialize(max);

diff --git a/src/elements/flip-card/flip-card-summary/flip-card-summary.ts b/src/elements/flip-card/flip-card-summary/flip-card-summary.ts
@@ -26,10 +26,10 @@ class SbbFlipCardSummaryElement extends LitElement {
   @property({ attribute: 'image-alignment', reflect: true })
   public accessor imageAlignment: SbbFlipCardImageAlignment = 'after';
 
-  protected override willUpdate(_changedProperties: PropertyValues): void {
-    super.willUpdate(_changedProperties);
+  protected override willUpdate(changedProperties: PropertyValues<this>): void {
+    super.willUpdate(changedProperties);
 
-    if (_changedProperties.has('imageAlignment')) {
+    if (changedProperties.has('imageAlignment')) {
       this.closest?.('sbb-flip-card')?.setAttribute('data-image-alignment', this.imageAlignment);
     }
   }

diff --git a/src/elements/icon/icon.snapshot.spec.ts b/src/elements/icon/icon.snapshot.spec.ts
@@ -1,8 +1,7 @@
-import { aTimeout, expect } from '@open-wc/testing';
+import { expect } from '@open-wc/testing';
 import { html } from 'lit/static-html.js';
 
-import { mergeConfig, type SbbIconConfig } from '../core/config.js';
-import { readConfig } from '../core/config.js';
+import { mergeConfig, readConfig, type SbbIconConfig } from '../core/config.js';
 import { fixture, testA11yTreeSnapshot } from '../core/testing/private.js';
 import { waitForLitRender } from '../core/testing.js';
 
@@ -107,11 +106,6 @@ describe(`sbb-icon`, () => {
     `);
 
     icon.setAttribute('name', 'pie-medium');
-    // TODO: Optimize with https://lit.dev/docs/elements/lifecycle/#getUpdateComplete
-    // The update of the internal state happens a tick after the updateComplete down below completes.
-    // We could change this by implementing a getUpdateComplete which starts with a name change
-    // and completes with the new icon loaded.
-    await aTimeout(0);
     await waitForLitRender(icon);
 
     expect(icon).dom.to.be.equal(`

diff --git a/src/elements/icon/icon.ts b/src/elements/icon/icon.ts
@@ -6,7 +6,7 @@ import { forceType, omitEmptyConverter } from '../core/decorators.js';
 import { SbbIconBase } from './icon-base.js';
 
 /**
- * It displays an icon loaded from a registered namespace.
+ * Displays an icon loaded from a registered namespace.
  */
 export
 @customElement('sbb-icon')

diff --git a/src/elements/radio-button/radio-button-panel/radio-button-panel.ts b/src/elements/radio-button/radio-button-panel/radio-button-panel.ts
@@ -60,7 +60,7 @@ class SbbRadioButtonPanelElement extends SbbPanelMixin(
     this._hasSelectionExpansionPanelElement = !!this.closest?.('sbb-selection-expansion-panel');
   }
 
-  protected override async willUpdate(changedProperties: PropertyValues<this>): Promise<void> {
+  protected override willUpdate(changedProperties: PropertyValues<this>): void {
     super.willUpdate(changedProperties);
 
     if (changedProperties.has('checked')) {

diff --git a/src/elements/table/table-wrapper/table-wrapper.ts b/src/elements/table/table-wrapper/table-wrapper.ts
@@ -29,7 +29,7 @@ class SbbTableWrapperElement extends SbbNegativeMixin(LitElement) {
   });
   private _tableWrapper!: HTMLElement;
 
-  protected override firstUpdated(changedProperties: PropertyValues): void {
+  protected override firstUpdated(changedProperties: PropertyValues<this>): void {
     super.firstUpdated(changedProperties);
     this._tableWrapper = this.shadowRoot!.querySelector<HTMLElement>('.sbb-table-wrapper')!;
     this._resizeObserver.observe(this._tableWrapper);

diff --git a/src/elements/toggle-check/toggle-check.ts b/src/elements/toggle-check/toggle-check.ts
@@ -38,7 +38,7 @@ class SbbToggleCheckElement extends SbbFormAssociatedCheckboxMixin(SbbIconNameMi
   @property({ attribute: 'label-position', reflect: true })
   public accessor labelPosition: 'before' | 'after' = 'after';
 
-  protected override async willUpdate(changedProperties: PropertyValues<this>): Promise<void> {
+  protected override willUpdate(changedProperties: PropertyValues<this>): void {
     super.willUpdate(changedProperties);
 
     if (changedProperties.has('checked')) {