diff --git a/packages/nimble-components/src/rich-text/models/tests/markdown-parser.spec.ts b/packages/nimble-components/src/rich-text/models/tests/markdown-parser.spec.ts
index 59da86a46a..0ab4cf2703 100644
--- a/packages/nimble-components/src/rich-text/models/tests/markdown-parser.spec.ts
+++ b/packages/nimble-components/src/rich-text/models/tests/markdown-parser.spec.ts
@@ -958,7 +958,7 @@ describe('Markdown parser', () => {
mappings: BasicUserMentionMapping[],
pattern = ''
): Promise
> {
- return fixture(html`
+ return await fixture(html`
<${richTextMentionUsersTag} pattern="${pattern}">
${repeat(() => mappings, html`
<${mappingUserTag}
diff --git a/packages/nimble-components/src/rich-text/models/tests/markdown-serializer.spec.ts b/packages/nimble-components/src/rich-text/models/tests/markdown-serializer.spec.ts
index 963f46518a..3dc19dee42 100644
--- a/packages/nimble-components/src/rich-text/models/tests/markdown-serializer.spec.ts
+++ b/packages/nimble-components/src/rich-text/models/tests/markdown-serializer.spec.ts
@@ -13,7 +13,7 @@ import {
import { waitForUpdatesAsync } from '../../../testing/async-helpers';
async function setup(): Promise> {
- return fixture(
+ return await fixture(
html``
);
}
@@ -366,7 +366,8 @@ Plain text 3`);
expect(element.getMarkdown()).toEqual(' ');
});
- it('Multiple Mention node of different type', async () => {
+ // Intermittent on Webkit (at least), see https://github.com/ni/nimble/issues/2426
+ it('Multiple Mention node of different type #SkipWebkit', async () => {
await appendUserMentionConfiguration(element, [
{ key: 'user:1', displayName: 'username1' }
]);
diff --git a/packages/nimble-components/src/rich-text/viewer/tests/rich-text-viewer.spec.ts b/packages/nimble-components/src/rich-text/viewer/tests/rich-text-viewer.spec.ts
index fa4f02458c..73eed11c35 100644
--- a/packages/nimble-components/src/rich-text/viewer/tests/rich-text-viewer.spec.ts
+++ b/packages/nimble-components/src/rich-text/viewer/tests/rich-text-viewer.spec.ts
@@ -16,13 +16,13 @@ import type {
} from '../../editor/testing/types';
async function setup(): Promise> {
- return fixture(
+ return await fixture(
html`<${richTextViewerTag}>${richTextViewerTag}>`
);
}
async function setupMentionConfig(): Promise> {
- return fixture(
+ return await fixture(
// prettier-ignore
html`<${richTextViewerTag}>
<${richTextMentionUsersTag} pattern="^user:(.*)">
diff --git a/packages/nimble-components/src/select/index.ts b/packages/nimble-components/src/select/index.ts
index c3e94e4678..47278f3552 100644
--- a/packages/nimble-components/src/select/index.ts
+++ b/packages/nimble-components/src/select/index.ts
@@ -216,6 +216,9 @@ export class Select
private _value = '';
private forcedPosition = false;
private openActiveIndex?: number;
+ private readonly selectedOptionObserver? = new MutationObserver(() => {
+ this.updateDisplayValue();
+ });
/**
* @internal
@@ -226,6 +229,13 @@ export class Select
if (this.open) {
this.initializeOpenState();
}
+
+ this.observeSelectedOptionTextContent();
+ }
+
+ public override disconnectedCallback(): void {
+ super.disconnectedCallback();
+ this.selectedOptionObserver?.disconnect();
}
public override get value(): string {
@@ -1248,6 +1258,7 @@ export class Select
private updateValue(shouldEmit?: boolean): void {
if (this.$fastController.isConnected) {
this.value = this.firstSelectedOption?.value ?? '';
+ this.observeSelectedOptionTextContent();
}
if (shouldEmit) {
@@ -1307,6 +1318,23 @@ export class Select
this.setPositioning();
this.focusAndScrollOptionIntoView();
}
+
+ private observeSelectedOptionTextContent(): void {
+ this.selectedOptionObserver?.disconnect();
+
+ if (this.selectedIndex === -1) {
+ return;
+ }
+
+ const selectedOption = this.firstSelectedOption;
+ if (selectedOption) {
+ this.selectedOptionObserver?.observe(selectedOption, {
+ characterData: true,
+ subtree: true,
+ childList: true
+ });
+ }
+ }
}
const nimbleSelect = Select.compose({
diff --git a/packages/nimble-components/src/select/testing/select.pageobject.ts b/packages/nimble-components/src/select/testing/select.pageobject.ts
index 49c4f0df28..0a64fb7b15 100644
--- a/packages/nimble-components/src/select/testing/select.pageobject.ts
+++ b/packages/nimble-components/src/select/testing/select.pageobject.ts
@@ -8,7 +8,10 @@ import {
} from '@microsoft/fast-web-utilities';
import type { Select } from '..';
import type { ListOption } from '../../list-option';
-import { waitForUpdatesAsync } from '../../testing/async-helpers';
+import {
+ processUpdates,
+ waitForUpdatesAsync
+} from '../../testing/async-helpers';
import { FilterMode } from '../types';
import type { Button } from '../../button';
import type { ListOptionGroup } from '../../list-option-group';
@@ -199,6 +202,7 @@ export class SelectPageObject {
const clearButton = this.getClearButton();
clearButton?.click();
+ processUpdates();
}
public async clickAway(): Promise {
diff --git a/packages/nimble-components/src/select/testing/tests/select.pageobject.spec.ts b/packages/nimble-components/src/select/testing/tests/select.pageobject.spec.ts
index e2fe6a1ef3..cdf36d2759 100644
--- a/packages/nimble-components/src/select/testing/tests/select.pageobject.spec.ts
+++ b/packages/nimble-components/src/select/testing/tests/select.pageobject.spec.ts
@@ -10,7 +10,7 @@ async function setup(): Promise> {
Two
`;
- return fixture
`;
- return fixture