From 64df4a15b89a618d84f7d3c0aba8288ba526def3 Mon Sep 17 00:00:00 2001 From: Tim McConechy Date: Fri, 6 Sep 2024 13:37:42 -0400 Subject: [PATCH 1/4] Add fixes and tests for popups --- doc/CHANGELOG.md | 3 + .../ids-button/ids-button-base.scss | 5 -- src/components/ids-button/ids-button.scss | 2 +- .../ids-data-grid/ids-data-grid-filters.scss | 12 ++++ .../ids-data-grid/ids-data-grid-filters.ts | 2 +- src/components/ids-input/ids-input.scss | 7 +- .../demos/in-action-panel.html | 64 +++++++++++++++++ .../ids-menu-button/demos/in-action-panel.ts | 19 ++++++ .../ids-menu-button/demos/in-modal.html | 68 +++++++++++++++++++ .../ids-menu-button/demos/in-modal.ts | 40 +++++++++++ .../ids-menu-button/demos/in-popup.html | 56 +++++++++++++++ .../ids-menu-button/demos/in-popup.ts | 31 +++++++++ .../ids-menu-button/demos/index.yaml | 9 +++ .../ids-popup-menu/ids-popup-menu.ts | 9 +++ src/components/ids-popup/ids-popup.ts | 9 ++- .../default/ids-theme-default-core.scss | 6 +- 16 files changed, 329 insertions(+), 13 deletions(-) create mode 100644 src/components/ids-menu-button/demos/in-action-panel.html create mode 100644 src/components/ids-menu-button/demos/in-action-panel.ts create mode 100644 src/components/ids-menu-button/demos/in-modal.html create mode 100644 src/components/ids-menu-button/demos/in-modal.ts create mode 100644 src/components/ids-menu-button/demos/in-popup.html create mode 100644 src/components/ids-menu-button/demos/in-popup.ts diff --git a/doc/CHANGELOG.md b/doc/CHANGELOG.md index 2eb349c16e..cb5ea4045d 100644 --- a/doc/CHANGELOG.md +++ b/doc/CHANGELOG.md @@ -29,6 +29,7 @@ - `[Datagrid]` Fixed bug editor dropdown can't be re-opened after closing. ([#2589](https://github.com/infor-design/enterprise-wc/issues/2589)) - `[Dropdown]` Made the `typeahead` setting true by default. ([#2770](https://github.com/infor-design/enterprise-wc/issues/2770)) - `[Homepage]` Converted home page tests to playwright. ([#1940](https://github.com/infor-design/enterprise-wc/issues/1940)) +- `[Input]` Fixed position of password button and text color in dark mode. ([#4665](https://inforwiki.atlassian.net/browse/IDS-4665)) - `[LayoutGrid]` Fixed recursion issue in maxWidth setter. ([#2470]https://github.com/infor-design/enterprise-wc/issues/2470) - `[Listbuilder]` Fixed buggy builder styles. ([#2701](https://github.com/infor-design/enterprise-wc/issues/2701)) - `[Listbuilder]` Fixed an issue where clicking the row in the wrong spot would edit the wrong row. ([#2701](https://github.com/infor-design/enterprise-wc/issues/2701)) @@ -36,9 +37,11 @@ - `[Locale]` Fixed translation issue of `Available` into Thai and Italian. ([#8786](https://github.com/infor-design/enterprise-wc/issues/8786)) - `[Listbuilder]` Fixed buggy builder styles. ([#2701](https://github.com/infor-design/enterprise-wc/issues/2701)) - `[Listbuilder]` Fixed an issue where clicking the row in the wrong spot would edit the wrong row. ([#2701](https://github.com/infor-design/enterprise-wc/issues/2701)) +- `[Modal]` Fixed missing border between modal buttons. ([#4660](https://inforwiki.atlassian.net/browse/IDS-4660)) - `[Multiselect]` Added `placeholder` attribute to `ids-multiselect` to allow for a placeholder value. ([#2758](https://github.com/infor-design/enterprise-wc/issues/2758)) - `[Multiselect]` Converted multiselect tests to playwright. ([#1957](https://github.com/infor-design/enterprise-wc/issues/1957)) - `[Popup]` Fixed an issue where the popup took up space when initially loaded. ([#2777](https://github.com/infor-design/enterprise-wc/issues/2777)) +- `[PopupMenu/Datagrid]` Fixed an issue where popupmenu is not in the correct position on modals or action panels. ([#4264](https://inforwiki.atlassian.net/browse/IDS-4264)) - `[Pager]` Fixed an issue where the disabled attribute of navigation buttons was overridden by the pager. ([#2738](https://github.com/infor-design/enterprise-wc/issues/2738)) - `[Radio]` Fixed an issue where the radio group could not set checked for radio elements when using Angular's FormControl and value binding. ([#2700](https://github.com/infor-design/enterprise-wc/issues/2700)) - `[Splitter]` Converted datagrid popups to fixed to go over splitter panes. ([#2499](https://github.com/infor-design/enterprise-wc/issues/2499)) diff --git a/src/components/ids-button/ids-button-base.scss b/src/components/ids-button/ids-button-base.scss index 46bdae2bf6..bcb563422f 100644 --- a/src/components/ids-button/ids-button-base.scss +++ b/src/components/ids-button/ids-button-base.scss @@ -111,10 +111,6 @@ margin-inline: var(--ids-space-none); } - &:not(.no-margins) { - margin: var(--ids-button-alt-margin); - } - &.field-height-xxs:not(.btn-secondary):not(.no-margins) { margin-block-start: 3px; margin-inline-end: -2px; @@ -734,4 +730,3 @@ } } } - diff --git a/src/components/ids-button/ids-button.scss b/src/components/ids-button/ids-button.scss index b59d0cb03b..6fb2c3335c 100644 --- a/src/components/ids-button/ids-button.scss +++ b/src/components/ids-button/ids-button.scss @@ -146,7 +146,7 @@ button { border-radius: var(--ids-border-radius-none); } - .ids-icon { + .ids-icon:not(.dropdown-icon) { display: block; padding-inline-start: var(--ids-space-3xs); font-size: 0; diff --git a/src/components/ids-data-grid/ids-data-grid-filters.scss b/src/components/ids-data-grid/ids-data-grid-filters.scss index bf5f6554ef..e9b8ed0705 100644 --- a/src/components/ids-data-grid/ids-data-grid-filters.scss +++ b/src/components/ids-data-grid/ids-data-grid-filters.scss @@ -43,4 +43,16 @@ } } } + + + [data-filter-conditions-button] { + --ids-button-icon-height: 32px; + --ids-button-icon-width: 38px; + + margin-inline-end: 2px; + + ids-icon-button { + padding-inline-start: 0; + } + } } diff --git a/src/components/ids-data-grid/ids-data-grid-filters.ts b/src/components/ids-data-grid/ids-data-grid-filters.ts index bda6b29f5f..3c972c7ef7 100644 --- a/src/components/ids-data-grid/ids-data-grid-filters.ts +++ b/src/components/ids-data-grid/ids-data-grid-filters.ts @@ -169,13 +169,13 @@ export default class IdsDataGridFilters { const filterButton = `${this.#filterButtonTemplate(TYPE, column)}`; const trigger = `${this.#triggerFieldTemplate(TYPE, column, 'calendar', 'DatePickerTriggerButton')}`; + const popup = ``; if (column.align === 'right') return `${trigger}${filterButton}${popup}`; diff --git a/src/components/ids-input/ids-input.scss b/src/components/ids-input/ids-input.scss index 80e6c30950..36483298c6 100644 --- a/src/components/ids-input/ids-input.scss +++ b/src/components/ids-input/ids-input.scss @@ -314,6 +314,7 @@ $input-size-full: 100%; box-sizing: border-box; background-color: var(--ids-color-transparent); border: none; + color: inherit; font-family: var(--ids-font-family-default), var(--ids-font-family-system-sans); padding-block-start: var(--ids-space-2xs); padding-block-end: var(--ids-space-2xs); @@ -407,7 +408,7 @@ $input-size-full: 100%; .validation-message { width: $border-input-size-xs; } - } + } &.sm { .field-container, @@ -906,6 +907,10 @@ $input-size-full: 100%; padding-inline-end: var(--ids-space-xs); } +.show-hide-password { + padding-inline-end: var(--ids-space-3xs); +} + .is-uppercase { text-transform: uppercase; } diff --git a/src/components/ids-menu-button/demos/in-action-panel.html b/src/components/ids-menu-button/demos/in-action-panel.html new file mode 100644 index 0000000000..7b4ef7ce42 --- /dev/null +++ b/src/components/ids-menu-button/demos/in-action-panel.html @@ -0,0 +1,64 @@ + + + + + + <%= htmlWebpackPlugin.options.title %> + + <%= htmlWebpackPlugin.options.font %> + + + + + + + diff --git a/src/components/ids-menu-button/demos/in-action-panel.ts b/src/components/ids-menu-button/demos/in-action-panel.ts new file mode 100644 index 0000000000..26f8c93710 --- /dev/null +++ b/src/components/ids-menu-button/demos/in-action-panel.ts @@ -0,0 +1,19 @@ +import '../ids-menu-button'; +import '../../ids-input/ids-input'; +import '../../ids-list-box/ids-list-box'; +import '../../ids-list-box/ids-list-box-option'; +import '../../ids-popup/ids-popup'; +import '../../ids-layout-flex/ids-scroll-container'; +import '../../ids-action-panel/ids-action-panel'; +import type IdsActionPanel from '../../ids-action-panel/ids-action-panel'; + +document.addEventListener('DOMContentLoaded', () => { + const triggerId = '#popup-trigger-btn'; + const triggerBtn = document.querySelector(triggerId); + const actionPanel = document.querySelector('ids-action-panel'); + + // Toggle action panel + triggerBtn?.addEventListener('click', async () => { + await actionPanel?.show(); + }); +}); diff --git a/src/components/ids-menu-button/demos/in-modal.html b/src/components/ids-menu-button/demos/in-modal.html new file mode 100644 index 0000000000..62013ae0a4 --- /dev/null +++ b/src/components/ids-menu-button/demos/in-modal.html @@ -0,0 +1,68 @@ + + + + + + <%= htmlWebpackPlugin.options.title %> + + <%= htmlWebpackPlugin.options.font %> + + + + + + + diff --git a/src/components/ids-menu-button/demos/in-modal.ts b/src/components/ids-menu-button/demos/in-modal.ts new file mode 100644 index 0000000000..2311763a1c --- /dev/null +++ b/src/components/ids-menu-button/demos/in-modal.ts @@ -0,0 +1,40 @@ +import '../ids-menu-button'; +import '../../ids-input/ids-input'; +import '../../ids-list-box/ids-list-box'; +import '../../ids-modal/ids-modal'; +import '../../ids-list-box/ids-list-box-option'; +import '../../ids-popup/ids-popup'; +import '../../ids-layout-flex/ids-scroll-container'; +import css from '../../../assets/css/ids-popup/index.css'; + +const cssLink = ``; +const head = document.querySelector('head'); +if (head) { + head.insertAdjacentHTML('afterbegin', cssLink); +} + +document.addEventListener('DOMContentLoaded', () => { + const triggerId = '#modal-trigger-btn'; + const triggerBtn: any = document.querySelector(triggerId); + const modal: any = document.querySelector('ids-modal'); + + // Links the Modal to its trigger button (sets up click/focus events) + modal.target = triggerBtn; + modal.triggerType = 'click'; + + // Disable the trigger button when showing the Modal. + modal.addEventListener('beforeshow', () => { + triggerBtn.disabled = true; + return true; + }); + + // Close the modal when its inner button is clicked. + modal.onButtonClick = () => { + modal.hide(); + }; + + // After the modal is done hiding, re-enable its trigger button. + modal.addEventListener('hide', () => { + triggerBtn.disabled = false; + }); +}); diff --git a/src/components/ids-menu-button/demos/in-popup.html b/src/components/ids-menu-button/demos/in-popup.html new file mode 100644 index 0000000000..9efc74abfe --- /dev/null +++ b/src/components/ids-menu-button/demos/in-popup.html @@ -0,0 +1,56 @@ + + + + <%= htmlWebpackPlugin.options.title %> + <%= htmlWebpackPlugin.options.font %> + + + + + diff --git a/src/components/ids-menu-button/demos/in-popup.ts b/src/components/ids-menu-button/demos/in-popup.ts new file mode 100644 index 0000000000..657389ccd5 --- /dev/null +++ b/src/components/ids-menu-button/demos/in-popup.ts @@ -0,0 +1,31 @@ +import '../ids-menu-button'; +import '../../ids-popup/ids-popup'; +import css from '../../../assets/css/ids-popup/index.css'; + +const cssLink = ``; +const head = document.querySelector('head'); +if (head) { + head.insertAdjacentHTML('afterbegin', cssLink); +} + +document.addEventListener('DOMContentLoaded', () => { + const triggerId = '#popup-trigger-btn'; + const triggerBtn = document.querySelector(triggerId); + const popup: any = document.querySelector('#popup-1'); + if (!popup) { + return; + } + popup.arrow = 'right'; + + // Toggle the Popup + triggerBtn?.addEventListener('click', () => { + if (!popup.visible) popup.visible = true; // closes automatically on click out + }); + + popup.addEventListener('hide', () => { + console.info('Hide event fired'); + }); + popup.addEventListener('show', () => { + console.info('Show event fired'); + }); +}); diff --git a/src/components/ids-menu-button/demos/index.yaml b/src/components/ids-menu-button/demos/index.yaml index c301249867..128af75304 100644 --- a/src/components/ids-menu-button/demos/index.yaml +++ b/src/components/ids-menu-button/demos/index.yaml @@ -17,6 +17,15 @@ - link: load-data.html type: Example description: Showing loading data on beforeShow (with ajax) + - link: in-action-panel.html + type: Example + description: Showing a menu button in an action panel + - link: in-modal.html + type: Example + description: Showing a menu button in a modal + - link: in-popup.html + type: Example + description: Showing a menu button in a popup - link: side-by-side.html type: Side-by-side Example description: Showing a menu button side by side with 4.x diff --git a/src/components/ids-popup-menu/ids-popup-menu.ts b/src/components/ids-popup-menu/ids-popup-menu.ts index d42753138f..0ff09d73b3 100644 --- a/src/components/ids-popup-menu/ids-popup-menu.ts +++ b/src/components/ids-popup-menu/ids-popup-menu.ts @@ -2,6 +2,7 @@ import { customElement, scss } from '../../core/ids-decorators'; import { attributes, htmlAttributes } from '../../core/ids-attributes'; import { stripHTML } from '../../utils/ids-xss-utils/ids-xss-utils'; import { + getClosest, getElementAtMouseLocation, parents, validMaxHeight @@ -355,6 +356,14 @@ export default class IdsPopupMenu extends Base { this.setAttribute(attributes.OFFSET_CONTAINER, this.parentMenu.offsetContainer); } + const isInModal = getClosest(this, 'ids-modal'); + const isInActionPanel = getClosest(this, 'ids-action-panel'); + if (isInModal) { + this.setAttribute(attributes.OFFSET_CONTAINER, 'ids-modal'); + } + if (isInActionPanel) { + this.setAttribute(attributes.OFFSET_CONTAINER, 'ids-action-panel'); + } // Show the popup and do placement this.popup!.positionStyle = this.positionStyle; this.popup?.setAttribute('visible', 'true'); diff --git a/src/components/ids-popup/ids-popup.ts b/src/components/ids-popup/ids-popup.ts index 76f2307c74..e66adf8b68 100644 --- a/src/components/ids-popup/ids-popup.ts +++ b/src/components/ids-popup/ids-popup.ts @@ -1556,11 +1556,16 @@ export default class IdsPopup extends Base { if (this.useRight) xProp = 'right'; if (this.offsetContainer) { - const containerElem = getClosest(this, this.offsetContainer); + let containerElem = getClosest(this, this.offsetContainer); + let offsetY = 0; + if (containerElem?.nodeName === 'IDS-MODAL' || containerElem?.nodeName === 'IDS-ACTION-PANEL') { + containerElem = containerElem.shadowRoot.querySelector('ids-popup')?.container; + offsetY = getClosest(this, 'ids-data-grid') ? 60 : 0; + } if (containerElem) { const containerRect: DOMRect = containerElem.getBoundingClientRect(); popupRect.x -= containerRect.left; - popupRect.y -= containerRect.top; + popupRect.y -= containerRect.top + offsetY; } } diff --git a/src/themes/default/ids-theme-default-core.scss b/src/themes/default/ids-theme-default-core.scss index 226f314b80..160eb1f32e 100644 --- a/src/themes/default/ids-theme-default-core.scss +++ b/src/themes/default/ids-theme-default-core.scss @@ -608,7 +608,7 @@ --ids-data-grid-row-grouped-font-weight: var(--ids-font-weight-semibold); // Date Picker - --ids-date-picker-open-trigger-button-color-text: var(--ids-color-primary) + --ids-date-picker-open-trigger-button-color-text: var(--ids-color-primary); --ids-date-picker-color-border: var(--ids-color-primary); --ids-date-picker-dropdown-button-color-text: var(--ids-color-neutral-100); --ids-date-picker-dropdown-color-focus: var(--ids-shadow-md); @@ -1336,7 +1336,7 @@ --ids-spinbox-color-background-default: var(--ids-trigger-field-color-background-default); --ids-spinbox-color-background-readonly: var(--ids-trigger-field-color-background-readonly); --ids-spinbox-color-text-readonly: var(--ids-trigger-field-color-text-readonly); - --ids-spinbox-color-border-focus: var(--ids-trigger-field-color-border-focus) + --ids-spinbox-color-border-focus: var(--ids-trigger-field-color-border-focus); --ids-spinbox-shadow-focus: var(--ids-trigger-field-shadow-focus); --ids-spinbox-color-text-disabled: var(--ids-trigger-field-color-text-disabled); --ids-spinbox-color-border-disabled: var(--ids-trigger-field-color-border-disabled); @@ -1667,7 +1667,7 @@ --ids-trigger-field-color-background-readonly: var(--ids-input-color-background-readonly); --ids-trigger-field-color-border-readonly: var(--ids-input-color-border-readonly); --ids-trigger-field-color-text-readonly: var(--ids-input-color-text-readonly); - --ids-trigger-field-color-border-focus: var(--ids-input-color-border-focus) + --ids-trigger-field-color-border-focus: var(--ids-input-color-border-focus); --ids-trigger-field-shadow-focus: var(--ids-input-shadow-info-focus); --ids-trigger-field-color-text-disabled: var(--ids-color-foreground-default-default); --ids-trigger-field-color-border-disabled: var(--ids-input-color-border-disabled); From c2d21a06d169e484a6e17dbff91f836659f2c099 Mon Sep 17 00:00:00 2001 From: Tim McConechy Date: Fri, 6 Sep 2024 14:01:22 -0400 Subject: [PATCH 2/4] Move example --- src/components/ids-menu-button/demos/index.yaml | 9 --------- .../demos/in-action-panel.html | 0 .../demos/in-action-panel.ts | 2 +- .../demos/in-modal.html | 0 .../demos/in-modal.ts | 2 +- .../demos/in-popup.html | 0 .../demos/in-popup.ts | 2 +- src/components/ids-popup-menu/demos/index.yaml | 9 +++++++++ 8 files changed, 12 insertions(+), 12 deletions(-) rename src/components/{ids-menu-button => ids-popup-menu}/demos/in-action-panel.html (100%) rename src/components/{ids-menu-button => ids-popup-menu}/demos/in-action-panel.ts (93%) rename src/components/{ids-menu-button => ids-popup-menu}/demos/in-modal.html (100%) rename src/components/{ids-menu-button => ids-popup-menu}/demos/in-modal.ts (96%) rename src/components/{ids-menu-button => ids-popup-menu}/demos/in-popup.html (100%) rename src/components/{ids-menu-button => ids-popup-menu}/demos/in-popup.ts (94%) diff --git a/src/components/ids-menu-button/demos/index.yaml b/src/components/ids-menu-button/demos/index.yaml index 128af75304..c301249867 100644 --- a/src/components/ids-menu-button/demos/index.yaml +++ b/src/components/ids-menu-button/demos/index.yaml @@ -17,15 +17,6 @@ - link: load-data.html type: Example description: Showing loading data on beforeShow (with ajax) - - link: in-action-panel.html - type: Example - description: Showing a menu button in an action panel - - link: in-modal.html - type: Example - description: Showing a menu button in a modal - - link: in-popup.html - type: Example - description: Showing a menu button in a popup - link: side-by-side.html type: Side-by-side Example description: Showing a menu button side by side with 4.x diff --git a/src/components/ids-menu-button/demos/in-action-panel.html b/src/components/ids-popup-menu/demos/in-action-panel.html similarity index 100% rename from src/components/ids-menu-button/demos/in-action-panel.html rename to src/components/ids-popup-menu/demos/in-action-panel.html diff --git a/src/components/ids-menu-button/demos/in-action-panel.ts b/src/components/ids-popup-menu/demos/in-action-panel.ts similarity index 93% rename from src/components/ids-menu-button/demos/in-action-panel.ts rename to src/components/ids-popup-menu/demos/in-action-panel.ts index 26f8c93710..e9482ca7cd 100644 --- a/src/components/ids-menu-button/demos/in-action-panel.ts +++ b/src/components/ids-popup-menu/demos/in-action-panel.ts @@ -1,4 +1,4 @@ -import '../ids-menu-button'; +import '../../ids-menu-button/ids-menu-button'; import '../../ids-input/ids-input'; import '../../ids-list-box/ids-list-box'; import '../../ids-list-box/ids-list-box-option'; diff --git a/src/components/ids-menu-button/demos/in-modal.html b/src/components/ids-popup-menu/demos/in-modal.html similarity index 100% rename from src/components/ids-menu-button/demos/in-modal.html rename to src/components/ids-popup-menu/demos/in-modal.html diff --git a/src/components/ids-menu-button/demos/in-modal.ts b/src/components/ids-popup-menu/demos/in-modal.ts similarity index 96% rename from src/components/ids-menu-button/demos/in-modal.ts rename to src/components/ids-popup-menu/demos/in-modal.ts index 2311763a1c..a73b3ed6a7 100644 --- a/src/components/ids-menu-button/demos/in-modal.ts +++ b/src/components/ids-popup-menu/demos/in-modal.ts @@ -1,4 +1,4 @@ -import '../ids-menu-button'; +import '../../ids-menu-button/ids-menu-button'; import '../../ids-input/ids-input'; import '../../ids-list-box/ids-list-box'; import '../../ids-modal/ids-modal'; diff --git a/src/components/ids-menu-button/demos/in-popup.html b/src/components/ids-popup-menu/demos/in-popup.html similarity index 100% rename from src/components/ids-menu-button/demos/in-popup.html rename to src/components/ids-popup-menu/demos/in-popup.html diff --git a/src/components/ids-menu-button/demos/in-popup.ts b/src/components/ids-popup-menu/demos/in-popup.ts similarity index 94% rename from src/components/ids-menu-button/demos/in-popup.ts rename to src/components/ids-popup-menu/demos/in-popup.ts index 657389ccd5..fa5d263fd6 100644 --- a/src/components/ids-menu-button/demos/in-popup.ts +++ b/src/components/ids-popup-menu/demos/in-popup.ts @@ -1,4 +1,4 @@ -import '../ids-menu-button'; +import '../../ids-menu-button/ids-menu-button'; import '../../ids-popup/ids-popup'; import css from '../../../assets/css/ids-popup/index.css'; diff --git a/src/components/ids-popup-menu/demos/index.yaml b/src/components/ids-popup-menu/demos/index.yaml index cb3dd4c603..89852f31b1 100644 --- a/src/components/ids-popup-menu/demos/index.yaml +++ b/src/components/ids-popup-menu/demos/index.yaml @@ -29,6 +29,15 @@ - link: position-style.html type: Test description: Shows the effect of changing position style + - link: in-action-panel.html + type: Example + description: Showing a menu button in an action panel + - link: in-modal.html + type: Example + description: Showing a menu button in a modal + - link: in-popup.html + type: Example + description: Showing a menu button in a popup - link: in-offset-container.html type: Test description: Shows the effect of setting `offset-container` to adjust popup's fixed position From 4fd27ea02877d6e92896413e01cee3d9e9ae3e48 Mon Sep 17 00:00:00 2001 From: Tim McConechy Date: Fri, 6 Sep 2024 14:59:32 -0400 Subject: [PATCH 3/4] Remove uneeded tests --- .../ids-virtual-scroll.spec.ts | 17 ----------------- 1 file changed, 17 deletions(-) diff --git a/tests/ids-virtual-scroll/ids-virtual-scroll.spec.ts b/tests/ids-virtual-scroll/ids-virtual-scroll.spec.ts index 7e95398953..83e4c952c3 100644 --- a/tests/ids-virtual-scroll/ids-virtual-scroll.spec.ts +++ b/tests/ids-virtual-scroll/ids-virtual-scroll.spec.ts @@ -41,23 +41,6 @@ test.describe('IdsVirtualScroll tests', () => { }); test.describe('snapshot tests', () => { - test('should match innerHTML snapshot', async ({ page, browserName }) => { - if (browserName !== 'chromium') return; - const handle = await page.$('ids-virtual-scroll'); - const html = await handle?.evaluate((el: IdsVirtualScroll) => el?.outerHTML); - await expect(html).toMatchSnapshot('virtual-scroll-html'); - }); - - test('should match shadowRoot snapshot', async ({ page, browserName }) => { - if (browserName !== 'chromium') return; - const handle = await page.$('ids-virtual-scroll'); - const html = await handle?.evaluate((el: IdsVirtualScroll) => { - el?.shadowRoot?.querySelector('style')?.remove(); - return el?.shadowRoot?.innerHTML; - }); - await expect(html).toMatchSnapshot('virtual-scroll-shadow'); - }); - test('should match the visual snapshot in percy', async ({ page, browserName }) => { if (browserName !== 'chromium') return; await percySnapshot(page, 'ids-virtual-scroll-light'); From 214289fa6d9b46df6289223e95637254c5e2b0fd Mon Sep 17 00:00:00 2001 From: Tim McConechy Date: Fri, 6 Sep 2024 16:34:23 -0400 Subject: [PATCH 4/4] Remove date picker change --- src/components/ids-data-grid/ids-data-grid-filters.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/ids-data-grid/ids-data-grid-filters.ts b/src/components/ids-data-grid/ids-data-grid-filters.ts index 3c972c7ef7..07804c5c96 100644 --- a/src/components/ids-data-grid/ids-data-grid-filters.ts +++ b/src/components/ids-data-grid/ids-data-grid-filters.ts @@ -176,6 +176,7 @@ export default class IdsDataGridFilters { trigger-type="click" id="popup-${id}" no-margins + compact="true" ${format}${showToday}${firstDayOfWeek}${value}${disabled}>`; if (column.align === 'right') return `${trigger}${filterButton}${popup}`;