From a112528ec429c96f2017e95bbbdb22e578be1c08 Mon Sep 17 00:00:00 2001 From: Jesse Attas Date: Mon, 18 Mar 2024 11:18:06 -0500 Subject: [PATCH] Disable and tag tests failing in specific browsers (#1941) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Pull Request ## ๐Ÿคจ Rationale One of the tasks in #1747 is to run nimble-components tests in WebKit and see if there are any new failures. There are several. We also wanted to start tracking specific issues for each root cause rather than catch all issues like #1074 and #1075. ## ๐Ÿ‘ฉโ€๐Ÿ’ป Implementation Marked each failing test with one of these specific issues: - #1936 - #1938 TODO: ALSO FILE AZDO BUG - #1939 - #1940 - #1942 - #1943 Also re-enabled a couple of table header tests in Firefox which are now passing. ## ๐Ÿงช Testing Ran tests in Playwright webkit browser, Firefox, and Safari and and all the enabled tests now pass. ## โœ… Checklist - [x] I have updated the project documentation to reflect my changes or determined no changes are needed. --------- Co-authored-by: Milan Raj --- ...-1e68ef0e-2e70-4f32-86a4-e9073c251a0e.json | 7 +++ .../src/dialog/tests/dialog.spec.ts | 12 ++--- .../src/drawer/tests/drawer.spec.ts | 14 ++--- .../tests/rich-text-editor-mention.spec.ts | 12 +++-- .../editor/tests/rich-text-editor.spec.ts | 53 ++++++++++++------- .../models/tests/markdown-serializer.spec.ts | 18 ++++--- .../tests/table-column-date-text.spec.ts | 18 ++++--- .../header/tests/table-header.spec.ts | 6 +-- .../table/tests/table-column-sizing.spec.ts | 3 +- .../src/table/tests/table.spec.ts | 3 +- 10 files changed, 92 insertions(+), 54 deletions(-) create mode 100644 change/@ni-nimble-components-1e68ef0e-2e70-4f32-86a4-e9073c251a0e.json diff --git a/change/@ni-nimble-components-1e68ef0e-2e70-4f32-86a4-e9073c251a0e.json b/change/@ni-nimble-components-1e68ef0e-2e70-4f32-86a4-e9073c251a0e.json new file mode 100644 index 0000000000..a9f32d1b2e --- /dev/null +++ b/change/@ni-nimble-components-1e68ef0e-2e70-4f32-86a4-e9073c251a0e.json @@ -0,0 +1,7 @@ +{ + "type": "none", + "comment": "Marking tests that fail on some browsers", + "packageName": "@ni/nimble-components", + "email": "jattasNI@users.noreply.github.com", + "dependentChangeType": "none" +} diff --git a/packages/nimble-components/src/dialog/tests/dialog.spec.ts b/packages/nimble-components/src/dialog/tests/dialog.spec.ts index 1dc9f0f293..89a81e6cdc 100644 --- a/packages/nimble-components/src/dialog/tests/dialog.spec.ts +++ b/packages/nimble-components/src/dialog/tests/dialog.spec.ts @@ -272,8 +272,8 @@ describe('Dialog', () => { await disconnect(); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('focuses the first button on the dialog when it opens #SkipFirefox', async () => { + // Some browsers skipped, see: https://github.com/ni/nimble/issues/1936 + it('focuses the first button on the dialog when it opens #SkipFirefox #SkipWebkit', async () => { const { element, connect, disconnect } = await setup(); await connect(); const okButton = document.getElementById('ok')!; @@ -285,8 +285,8 @@ describe('Dialog', () => { await disconnect(); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('focuses the button with autofocus when the dialog opens #SkipFirefox', async () => { + // Some browsers skipped, see: https://github.com/ni/nimble/issues/1936 + it('focuses the button with autofocus when the dialog opens #SkipFirefox #SkipWebkit', async () => { const { element, connect, disconnect } = await setup(); await connect(); const cancelButton = document.getElementById('cancel')!; @@ -300,8 +300,8 @@ describe('Dialog', () => { await disconnect(); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('supports opening multiple dialogs on top of each other #SkipFirefox', async () => { + // Some browsers skipped, see: https://github.com/ni/nimble/issues/1943 + it('supports opening multiple dialogs on top of each other #SkipFirefox #SkipWebkit', async () => { const { element, connect, disconnect } = await setup(); await connect(); const secondDialog = document.createElement('nimble-dialog'); diff --git a/packages/nimble-components/src/drawer/tests/drawer.spec.ts b/packages/nimble-components/src/drawer/tests/drawer.spec.ts index 99a99ff98f..eefa3b0f52 100644 --- a/packages/nimble-components/src/drawer/tests/drawer.spec.ts +++ b/packages/nimble-components/src/drawer/tests/drawer.spec.ts @@ -133,7 +133,7 @@ describe('Drawer', () => { await expectAsync(promise).toBePending(); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 + // Firefox skipped, see: https://github.com/ni/nimble/issues/1937 it('should resolve promise if drawer completely opens before being closed #SkipFirefox', async () => { const promise = element.show(); await completeAnimationAsync(element); @@ -235,15 +235,15 @@ describe('Drawer', () => { expect(afterDrawerCloseActiveElement).toBe(button2); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('focuses the first button on the drawer when it opens #SkipFirefox', () => { + // Some browsers skipped, see: https://github.com/ni/nimble/issues/1936 + it('focuses the first button on the drawer when it opens #SkipFirefox #SkipWebkit', () => { const okButton = document.getElementById('ok')!; void element.show(); expect(document.activeElement).toBe(okButton); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('focuses the button with autofocus when the drawer opens #SkipFirefox', () => { + // Some browsers skipped, see: https://github.com/ni/nimble/issues/1936 + it('focuses the button with autofocus when the drawer opens #SkipFirefox #SkipWebkit', () => { const cancelButton = document.getElementById('cancel')!; cancelButton.setAttribute('autofocus', ''); processUpdates(); @@ -251,8 +251,8 @@ describe('Drawer', () => { expect(document.activeElement).toBe(cancelButton); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('supports opening multiple drawers on top of each other #SkipFirefox', () => { + // Some browsers skipped, see: https://github.com/ni/nimble/issues/1943 + it('supports opening multiple drawers on top of each other #SkipFirefox #SkipWebkit', () => { const secondDrawer = document.createElement('nimble-drawer'); const secondDrawerButton = document.createElement('nimble-button'); secondDrawer.append(secondDrawerButton); diff --git a/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor-mention.spec.ts b/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor-mention.spec.ts index f149d9bae7..40839a1bd4 100644 --- a/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor-mention.spec.ts +++ b/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor-mention.spec.ts @@ -353,7 +353,8 @@ describe('RichTextEditorMention', () => { expect(pageObject.getMentionButtonLabel(0)).toBe(''); }); - it('should have button title and text when `button-label` updated', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have button title and text when `button-label` updated #SkipWebkit', async () => { const { userMentionElement } = await appendUserMentionConfiguration(element); userMentionElement.buttonLabel = 'at mention'; await waitForUpdatesAsync(); @@ -1032,7 +1033,8 @@ describe('RichTextEditor user mention via template', () => { expect(pageObject.getEditorFirstChildTextContent()).toBe('User @'); }); - it('should get `@` text without a preceding whitespace after a hard break, when button clicked', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should get `@` text without a preceding whitespace after a hard break, when button clicked #SkipWebkit', async () => { await pageObject.setEditorTextContent('User'); await pageObject.pressShiftEnterKeysInEditor(); await pageObject.clickUserMentionButton(); @@ -1045,7 +1047,8 @@ describe('RichTextEditor user mention via template', () => { expect(pageObject.getEditorFirstChildTextContent()).toBe('User@'); }); - it('should get `@` text with a single preceding whitespace after a hard break with a text, when button clicked', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should get `@` text with a single preceding whitespace after a hard break with a text, when button clicked #SkipWebkit', async () => { await pageObject.setEditorTextContent('User'); await pageObject.pressShiftEnterKeysInEditor(); await pageObject.setEditorTextContent('Text'); @@ -1354,7 +1357,8 @@ describe('RichTextEditorMentionListbox', () => { expect(pageObject.isMentionListboxOpened()).toBeFalse(); }); - it('setting `disabled` should close the mention popup', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('setting `disabled` should close the mention popup #SkipWebkit', async () => { await appendUserMentionConfiguration(element, [ { key: 'user:1', displayName: 'username1' }, { key: 'user:2', displayName: 'username2' } diff --git a/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor.spec.ts b/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor.spec.ts index 2aebf54f11..a7bccd0633 100644 --- a/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor.spec.ts +++ b/packages/nimble-components/src/rich-text/editor/tests/rich-text-editor.spec.ts @@ -215,20 +215,28 @@ describe('RichTextEditor', () => { describe('keyboard shortcuts should update the checked state of the buttons', () => { parameterizeSpec(formattingButtons, (spec, name, value) => { - spec(`"${name}" button keyboard shortcut check`, async () => { - expect( - pageObject.getButtonCheckedState(value.toolbarButtonIndex) - ).toBeFalse(); + spec( + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + `"${name}" button keyboard shortcut check #SkipWebkit`, + async () => { + expect( + pageObject.getButtonCheckedState( + value.toolbarButtonIndex + ) + ).toBeFalse(); - await pageObject.clickEditorShortcutKeys( - value.shortcutKey, - value.shiftKey - ); + await pageObject.clickEditorShortcutKeys( + value.shortcutKey, + value.shiftKey + ); - expect( - pageObject.getButtonCheckedState(value.toolbarButtonIndex) - ).toBeTrue(); - }); + expect( + pageObject.getButtonCheckedState( + value.toolbarButtonIndex + ) + ).toBeTrue(); + } + ); }); }); @@ -255,7 +263,8 @@ describe('RichTextEditor', () => { }); describe('rich text formatting options to its respective HTML elements', () => { - it('should have "br" tag name when clicking shift + enter', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + enter #SkipWebkit', async () => { await pageObject.setEditorTextContent('Plain text 1'); await pageObject.pressShiftEnterKeysInEditor(); await pageObject.setEditorTextContent('Plain text 2'); @@ -272,7 +281,8 @@ describe('RichTextEditor', () => { expect(pageObject.getEditorLeafContents()).toEqual(['bold']); }); - it('should have br tag name when pressing shift + Enter with bold content', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + Enter with bold content #SkipWebkit', async () => { await pageObject.toggleFooterButton(ToolbarButton.bold); await pageObject.setEditorTextContent('bold1'); await pageObject.pressShiftEnterKeysInEditor(); @@ -294,7 +304,8 @@ describe('RichTextEditor', () => { expect(pageObject.getEditorLeafContents()).toEqual(['italics']); }); - it('should have br tag name when pressing shift + Enter with Italics content', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + Enter with Italics content #SkipWebkit', async () => { await pageObject.toggleFooterButton(ToolbarButton.italics); await pageObject.setEditorTextContent('italics1'); await pageObject.pressShiftEnterKeysInEditor(); @@ -437,7 +448,8 @@ describe('RichTextEditor', () => { }); }); - it('should have br tag name when pressing shift + Enter with numbered list content', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + Enter with numbered list content #SkipWebkit', async () => { await pageObject.setEditorTextContent('numbered list1'); await pageObject.toggleFooterButton(ToolbarButton.numberedList); await pageObject.pressShiftEnterKeysInEditor(); @@ -496,7 +508,8 @@ describe('RichTextEditor', () => { ).toBeTrue(); }); - it('should have br tag name when pressing shift + Enter with nested numbered lists content', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + Enter with nested numbered lists content #SkipWebkit', async () => { await pageObject.setEditorTextContent('List'); await pageObject.toggleFooterButton(ToolbarButton.numberedList); await pageObject.pressEnterKeyInEditor(); @@ -585,7 +598,8 @@ describe('RichTextEditor', () => { expect(pageObject.getEditorLeafContents()).toEqual(['Bullet List']); }); - it('should have br tag name when pressing shift + Enter with bulleted list content', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + Enter with bulleted list content #SkipWebkit', async () => { await pageObject.setEditorTextContent('Bulleted List 1'); await pageObject.toggleFooterButton(ToolbarButton.bulletList); await pageObject.pressShiftEnterKeysInEditor(); @@ -644,7 +658,8 @@ describe('RichTextEditor', () => { ).toBeTrue(); }); - it('should have br tag name when pressing shift + Enter with nested bulleted lists content', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('should have br tag name when pressing shift + Enter with nested bulleted lists content #SkipWebkit', async () => { await pageObject.setEditorTextContent('List'); await pageObject.toggleFooterButton(ToolbarButton.bulletList); await pageObject.pressEnterKeyInEditor(); 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 493afc3567..121625c218 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 @@ -273,7 +273,8 @@ describe('Markdown serializer', () => { * Nested bulleted list`); }); - it('Hard break', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('Hard break #SkipWebkit', async () => { await pageObject.setEditorTextContent('Plain text 1'); await pageObject.pressShiftEnterKeysInEditor(); await pageObject.setEditorTextContent('Plain text 2'); @@ -284,7 +285,8 @@ Plain text 2\ Plain text 3`); }); - it('Hard break with bold', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('Hard break with bold #SkipWebkit', async () => { await pageObject.toggleFooterButton(ToolbarButton.bold); await pageObject.setEditorTextContent('Bold'); await pageObject.pressShiftEnterKeysInEditor(); @@ -293,7 +295,8 @@ Plain text 3`); **Bold**`); }); - it('Hard break with italics', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('Hard break with italics #SkipWebkit', async () => { await pageObject.toggleFooterButton(ToolbarButton.italics); await pageObject.setEditorTextContent('Italics'); await pageObject.pressShiftEnterKeysInEditor(); @@ -302,7 +305,8 @@ Plain text 3`); *Italics*`); }); - it('Hard break with bulleted list', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('Hard break with bulleted list #SkipWebkit', async () => { await pageObject.setEditorTextContent('Bulleted'); await pageObject.toggleFooterButton(ToolbarButton.bulletList); await pageObject.pressShiftEnterKeysInEditor(); @@ -311,7 +315,8 @@ Plain text 3`); list`); }); - it('Hard break with numbered list', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('Hard break with numbered list #SkipWebkit', async () => { await pageObject.setEditorTextContent('Numbered'); await pageObject.toggleFooterButton(ToolbarButton.numberedList); await pageObject.pressShiftEnterKeysInEditor(); @@ -320,7 +325,8 @@ Plain text 3`); list`); }); - it('Hard break with mention node', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1938 + it('Hard break with mention node #SkipWebkit', async () => { await appendUserMentionConfiguration(element, [ { key: 'user:1', displayName: 'username1' } ]); diff --git a/packages/nimble-components/src/table-column/date-text/tests/table-column-date-text.spec.ts b/packages/nimble-components/src/table-column/date-text/tests/table-column-date-text.spec.ts index 17da6cf4de..39c27995ff 100644 --- a/packages/nimble-components/src/table-column/date-text/tests/table-column-date-text.spec.ts +++ b/packages/nimble-components/src/table-column/date-text/tests/table-column-date-text.spec.ts @@ -119,7 +119,8 @@ describe('TableColumnDateText', () => { }); }); - it('changing fieldName updates display', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1940 + it('changing fieldName updates display #SkipWebkit', async () => { await table.setData([ { field: new Date('Dec 10, 2012, 10:35:05 PM').valueOf(), @@ -136,7 +137,8 @@ describe('TableColumnDateText', () => { ); }); - it('changing data from value to null displays blank', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1940 + it('changing data from value to null displays blank #SkipWebkit', async () => { await table.setData([ { field: new Date('Dec 10, 2012, 10:35:05 PM').valueOf() } ]); @@ -153,7 +155,8 @@ describe('TableColumnDateText', () => { expect(pageObject.getRenderedCellContent(0, 0)).toEqual(''); }); - it('changing data from null to value displays value', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1940 + it('changing data from null to value displays value #SkipWebkit', async () => { await table.setData([{ field: null }]); await waitForUpdatesAsync(); expect(pageObject.getRenderedCellContent(0, 0)).toEqual(''); @@ -178,7 +181,8 @@ describe('TableColumnDateText', () => { expect(pageObject.getRenderedCellContent(0, 0)).toEqual(''); }); - it('sets title when cell text is ellipsized', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1940 + it('sets title when cell text is ellipsized #SkipWebkit', async () => { table.style.width = '200px'; await table.setData([ { field: new Date('Dec 10, 2012, 10:35:05 PM').valueOf() } @@ -230,7 +234,8 @@ describe('TableColumnDateText', () => { expect(pageObject.getCellTitle(0, 0)).toEqual(''); }); - it('sets group header text to rendered date value', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1940 + it('sets group header text to rendered date value #SkipWebkit', async () => { await table.setData([ { field: new Date('Dec 10, 2012, 10:35:05 PM').valueOf() } ]); @@ -250,7 +255,8 @@ describe('TableColumnDateText', () => { expect(pageObject.getRenderedCellContent(0, 0)).toBe('12/10/2012'); }); - it('updates displayed date when lang token changes', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1940 + it('updates displayed date when lang token changes #SkipWebkit', async () => { await table.setData([ { field: new Date('Dec 10, 2012, 10:35:05 PM').valueOf() } ]); diff --git a/packages/nimble-components/src/table/components/header/tests/table-header.spec.ts b/packages/nimble-components/src/table/components/header/tests/table-header.spec.ts index 73afb916b5..fd72467373 100644 --- a/packages/nimble-components/src/table/components/header/tests/table-header.spec.ts +++ b/packages/nimble-components/src/table/components/header/tests/table-header.spec.ts @@ -46,8 +46,7 @@ describe('TableHeader', () => { expect(pageObject.isSortDescendingIconVisible()).toBeFalse(); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('has correct state when sorted ascending #SkipFirefox', async () => { + it('has correct state when sorted ascending', async () => { element.sortDirection = TableColumnSortDirection.ascending; element.firstSortedColumn = true; await waitForUpdatesAsync(); @@ -57,8 +56,7 @@ describe('TableHeader', () => { expect(pageObject.isSortDescendingIconVisible()).toBeFalse(); }); - // Firefox skipped, see: https://github.com/ni/nimble/issues/1075 - it('has correct state when sorted descending #SkipFirefox', async () => { + it('has correct state when sorted descending', async () => { element.sortDirection = TableColumnSortDirection.descending; element.firstSortedColumn = true; await waitForUpdatesAsync(); diff --git a/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts b/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts index bbdc7e8086..56012c72c5 100644 --- a/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts +++ b/packages/nimble-components/src/table/tests/table-column-sizing.spec.ts @@ -495,7 +495,8 @@ describe('Table Interactive Column Sizing', () => { expect(pageObject.isHorizontalScrollbarVisible()).toBeTrue(); }); - it('sizing table with a horizontal scrollbar does not change column widths until sized beyond current column pixel widths', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1939 + it('sizing table with a horizontal scrollbar does not change column widths until sized beyond current column pixel widths #SkipWebkit', async () => { // create horizontal scrollbar with total column width of 450 pageObject.dragSizeColumnByRightDivider(2, [100]); // size table below threshhold of total column widths diff --git a/packages/nimble-components/src/table/tests/table.spec.ts b/packages/nimble-components/src/table/tests/table.spec.ts index 8d0fad78c7..0eaaa3ee11 100644 --- a/packages/nimble-components/src/table/tests/table.spec.ts +++ b/packages/nimble-components/src/table/tests/table.spec.ts @@ -677,7 +677,8 @@ describe('Table', () => { verifyRenderedData(dataSubsetAtEnd); }); - it('and calls focusedRecycleCallback on focused cell views when a scroll happens', async () => { + // WebKit skipped, see https://github.com/ni/nimble/issues/1942 + it('and calls focusedRecycleCallback on focused cell views when a scroll happens #SkipWebkit', async () => { const focusableColumn = document.createElement( focusableColumnName ) as TestFocusableTableColumn;