diff --git a/app/views/components/datagrid/test-actions-reload.html b/app/views/components/datagrid/test-actions-reload.html new file mode 100644 index 0000000000..c6e89ee6c7 --- /dev/null +++ b/app/views/components/datagrid/test-actions-reload.html @@ -0,0 +1,78 @@ +
+
+ + + +
+
+ +
+
+ + + + diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 05387880eb..b71959733b 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -4,6 +4,45 @@ ### v4.21.2 Fixes +## v4.22.0 + +### v4.22.0 Deprecation + +- `[Icons]` The alert icons now all have a white background allowing them to appear on colored areas. There was previously a special `-solid` version of the icons created that is now not needed, if you used the `icon--solid` icon change it to just `icon-`. ([#396](https://github.com/infor-design/design-system/issues/396)) + +### v4.22.0 Features + +- `[Build]` Replaced UglifyES in the minification script with Terser ([#2660](https://github.com/infor-design/enterprise/issues/2660)) +- `[Build]` Added the Locale culture files to the minification script. `.min.js` versions of each locale are now available in the `dist/` folder. ([#2660](https://github.com/infor-design/enterprise/issues/2660)) +- `[Application Menu]` Improved design of the App Menu Accordion's hierarchy, among other visual improvements, in the Uplift theme. ([#2739](https://github.com/infor-design/enterprise/issues/2739)) +- `[Charts]` Added support for context menu event with charts. ([#2699](https://github.com/infor-design/enterprise/issues/2699)) +- `[Contextual Action Panel]` Added support for passing in a full range of settings to the underlying Modal component API. ([#2433](https://github.com/infor-design/enterprise/issues/2433)) +- `[Export]` Added support for separator to use custom string or object type with Export to CSV. ([#2490](https://github.com/infor-design/enterprise/issues/2490)) +- `[Locale]` Added support for fetching minified culture files. ([#2660](https://github.com/infor-design/enterprise/issues/2660)) +- `[Modal]` Added support for a "fullsize" sheet display at all times, or simply beneath the responsive breakpoint. ([#2433](https://github.com/infor-design/enterprise/issues/2433)) +- `[Tabs-Vertical]` Added the ability to personalize Vertical Tabs in accordance with theming. ([#2824](https://github.com/infor-design/enterprise/issues/2824)) +- `[Wizard]` Added support for short labels. If short labels not supplied it will add ellipsis to text and tooltip. ([#2604](https://github.com/infor-design/enterprise/issues/2604)) + +### v4.22.0 Fixes + +- `[Application Menu]` Fixed an issue where footer toolbar area was overlapping to menu content. ([#2552](https://github.com/infor-design/enterprise/issues/2552)) +- `[Application Menu]` Fixed an issue where tooltip was showing white text on white background which makes text to be unreadable. ([#2811](https://github.com/infor-design/enterprise/issues/2811)) +- `[Application Menu]` Fixed an issue on mobile where the body was scroll bouncing when dragging/scrolling in the app menu. ([#2434](https://github.com/infor-design/enterprise/issues/2434)) +- `[Bar Chart]` Fixed an issue where labels were overwritten when use more then one chart on page. ([#2723](https://github.com/infor-design/enterprise/issues/2723)) +- `[Buttons]` Adjust the contrast of buttons (tertiary) on uplift theme. ([#396](https://github.com/infor-design/design-system/issues/396)) +- `[Calendar]` Fixed an issue where the upcoming event description was overlapping the upcoming duration when text is too long, adjust width of spinbox count and fixed alignment of all day checkbox in uplift light theme. ([#2778](https://github.com/infor-design/enterprise/issues/2778)) +- `[Datagrid]` Fixed an issue where if you have duplicate Id's the columns many become misaligned. ([#2687](https://github.com/infor-design/enterprise/issues/2687)) +- `[Datagrid]` Made the text all white on the targeted achievement formatter. ([#2730](https://github.com/infor-design/enterprise/issues/2730)) +- `[Datagrid]` Fixed keyword search so that it will again work with client side paging. ([#2797](https://github.com/infor-design/enterprise/issues/2797)) +- `[Datagrid]` Fixed an issue where the header and cells do not align perfectly. ([#2849](https://github.com/infor-design/enterprise/issues/2849)) +- `[Datagrid]` Fixed an issue where actions menu was not opening after reload the data. ([#2876](https://github.com/infor-design/enterprise/issues/2876)) +- `[Datepicker]` Moved the today button to the datepicker header and adding a setting to hide it if wanted. ([#2704](https://github.com/infor-design/enterprise/issues/2704)) +- `[FieldSet]` Fixed an issue where the fieldset text in chart completion overlap when resizing the browser. ([#2610](https://github.com/infor-design/enterprise/issues/2610)) +- `[Datepicker]` Fixed a bug in datepicker where the destroy method does not readd the masking functionality. [2832](https://github.com/infor-design/enterprise/issues/2832)) +- `[Field Options]` Fixed an issue where the option menu is misaligned in full length input field in uplift theme. ([#2765](https://github.com/infor-design/enterprise/issues/2765)) +- `[Icons]` Added and updated the following icons: icon-new, icon-calculator, icon-save-new, icon-doc-check. ([#391](https://github.com/infor-design/design-system/issues/391)) +- `[Icons]` Added and updated the following icons: icon-bed, icon-user-clock, icon-phone-filled, icon-phone-empty. ([#419](https://github.com/infor-design/design-system/issues/419)) +- `[Listview]` Fixed an issue where empty message would not be centered if the listview in a flex container. ([#2716](https://github.com/infor-design/enterprise/issues/2716)) - `[Locale/Initialize]` Fixed an issue where opening some components like Contextual Action Panel would change the current locale because it calls initialize when it loads. ([#2873](https://github.com/infor-design/enterprise/issues/2873)) ## v4.21.1 diff --git a/src/components/datagrid/datagrid.formatters.js b/src/components/datagrid/datagrid.formatters.js index e38e789957..9e0a2a84c3 100644 --- a/src/components/datagrid/datagrid.formatters.js +++ b/src/components/datagrid/datagrid.formatters.js @@ -327,8 +327,8 @@ const formatters = { Actions(row, cell, value, col) { // Render an Action Formatter return ( - `` ); diff --git a/src/components/popupmenu/popupmenu.js b/src/components/popupmenu/popupmenu.js index 762b104679..a6fc37cb3b 100644 --- a/src/components/popupmenu/popupmenu.js +++ b/src/components/popupmenu/popupmenu.js @@ -141,6 +141,47 @@ PopupMenu.prototype = { this.predefinedItems = $().add(this.settings.predefined); }, + /** + * Set original dom position containment for given menu in case need to move + * @private + * @param {jQuery[]} menu the menu object + * @returns {void} + */ + setMenuOrgContainment(menu) { + if (!menu || !menu.length) { + return; + } + const parent = menu.parent(); + if (!parent.is('body')) { + this.menuOrgContainment = { parent, index: parent.children().index(menu) }; + } + }, + + /** + * Insert the given element to arbitrarily based on containment with parent and index + * @private + * @param {jQuery[]} elem the element to insert + * @param {object} containment the original dom position containment + * @returns {void} + */ + insertAtContainment(elem, containment) { + const isEl = el => el && el.length; + containment = containment || this.menuOrgContainment || {}; + if (isEl(elem) && isEl(containment.parent)) { + let index = containment.index; + const parent = containment.parent; + const lastIndex = parent.children().length; + if (index < 0) { + index = Math.max(0, lastIndex + 1 + index); + } + if (index < lastIndex) { + parent.children().eq(index).before(elem); + } else { + parent.append(elem); + } + } + }, + /** * Add markip including Aria * @private @@ -162,6 +203,7 @@ PopupMenu.prototype = { this.menu.data('trigger', this.element); triggerId = this.menu.data('trigger')[0].id; duplicateMenu = this.menu.clone(); + this.setMenuOrgContainment(duplicateMenu); duplicateMenu.detach().appendTo('body'); // add data-id attr to menus @@ -210,6 +252,7 @@ PopupMenu.prototype = { // to prevent containment issues. (Now a Preference) if (this.settings.attachToBody && this.menu.parent().not('body').length > 0) { this.originalParent = this.menu.prev(); + this.setMenuOrgContainment(this.menu); this.menu.detach().appendTo('body'); if (this.settings.duplicateMenu) { this.menu.attr('id', `${this.settings.menu}-original`); @@ -2232,12 +2275,14 @@ PopupMenu.prototype = { // Place the menu back where it came from while cleaning up. // Get an accurate target to place the menu back where it came from - let insertTarget = this.element; const searchfield = this.element.parent().children('.searchfield'); if (searchfield.length) { - insertTarget = searchfield.first(); + this.menu.insertAfter(searchfield.first()); + } else if (this.menuOrgContainment) { + this.insertAtContainment(this.menu); + } else { + this.menu.insertAfter(this.element); } - this.menu.insertAfter(insertTarget); // Cleanup menu items this.menu.find('.submenu').children('a').each((i, item) => { diff --git a/test/components/datagrid/datagrid.e2e-spec.js b/test/components/datagrid/datagrid.e2e-spec.js index e3ff40531d..0e4a58a001 100644 --- a/test/components/datagrid/datagrid.e2e-spec.js +++ b/test/components/datagrid/datagrid.e2e-spec.js @@ -3058,3 +3058,32 @@ describe('Datagrid Personalization tests', () => { expect(await element.all(by.css('.modal-content input[type="checkbox"]')).count()).toEqual(8); }); }); + +describe('Datagrid Actions Popupmenu tests', () => { + beforeEach(async () => { + await utils.setPage('/components/datagrid/test-actions-reload?layout=nofrills'); + const datagridEl = await element(by.css('#datagrid .datagrid-body tbody tr:nth-child(1)')); + await browser.driver + .wait(protractor.ExpectedConditions.presenceOf(datagridEl), config.waitsFor); + }); + + it('Should not have errors', async () => { + await utils.checkForErrors(); + }); + + it('Should open on click', async () => { + const selector = '#datagrid .datagrid-body tbody tr:nth-child(2) td:nth-child(1) .btn-actions'; + let menuBtn = await element(by.css(selector)); + menuBtn.click(); + + expect(await menuBtn.getAttribute('class')).toContain('is-open'); + await element(by.id('btn-reload')).click(); + menuBtn = await element(by.css(selector)); + + expect(await menuBtn.getAttribute('class')).not.toContain('is-open'); + menuBtn = await element(by.css(selector)); + menuBtn.click(); + + expect(await menuBtn.getAttribute('class')).toContain('is-open'); + }); +});