Disable and tag tests failing in specific browsers

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"
+}

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');

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,24 +235,24 @@ 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();
             void element.show();
             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);

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' }

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();

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' }
             ]);

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() }
             ]);

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();

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