Enterprise: Datagrid columns not sizing/aligning correct

[jamie-norman]

Describe the bug
Sometimes the last column of a datagrid list isn't sizing quite right to fit within the container, needing a horizontal scroll. Additionally, when using the horizontal scroll, grid header and data columns don't align correctly.

To Reproduce
Steps to reproduce the behavior:

1. Recruiter > Candidate Pool (ask for login info)
2. View last column in list
3. Scroll the list to the right
4. Collapse the application menu
5. Notice that the last column doesn't size correctly; misaligns with header on scroll

List of Issues

• [x] If last column is stretched and the menu is expanded, you have to scroll (doesnt run size logic)
• [ ] test minWidth setting

On Hold

• [x] http://jira.lawson.com/browse/LMCLIENT-22369 - not able to get the column settings and datagrid settings - not able to access the page as i am a recruiter not a manager - link not minified
• [ ] https://jira.lawson.com/browse/LMCLIENT-19853 - not able to get the column settings and datagrid settings - not able to access the page as i am a recruiter not a pay roll admin - link not minified
• [ ] https://jira.lawson.com/browse/LMCLIENT-22228 - not able to get the column settings and datagrid settings - not able to access the page as i am a recruiter not application admin - link not minified
• [ ] https://jira.lawson.com/browse/LMCLIENT-22495 - not able to get the column settings and datagrid settings - not able to access the page as i am a recruiter not true cost admin - link not minified
• [ ] https://jira.lawson.com/browse/LMCLIENT-22597 - not able to determine the column settings and datagrid settings and data to setup an example. What is a boolean column map to?
• [X] https://jira.lawson.com/browse/LMCLIENT-22228 - listed as can close

Expected behavior
Columns in grid should size to their content more efficiently. Columns should stay aligned with header on scroll. When collapsing the app menu, datagrid doesn't resize appropriately.

Screenshots
gif recording: http://recordit.co/vXZbc2V0Nd

Other examples- -
Benefits list after collapsing app menu:

Benefits enrollment groups - List/Detail example:

Platform

• Macbook pro/Chrome 70.0.3538.77

Another related Landmark ticket: http://jira.lawson.com/browse/LMCLIENT-22369

[tmcconechy]

As per our call will have to make some examples and isolate whats going on here before we estimate. I'll give it a 3 to do that and see if we need to adjust to fix.

[claudenbach]

Another related Landmark ticket: http://jira.lawson.com/browse/LMCLIENT-19853

[claudenbach]

Another related Landmark ticket: http://jira.lawson.com/browse/LMCLIENT-22228

[claudenbach]

Another related Landmark ticket: http://jira.lawson.com/browse/LMCLIENT-22495

[jeffweier]

Related Landmark ticket: http://jira.lawson.com/browse/LMCLIENT-22597

[jamie-norman]

Yet another LMCLIENT ticket: https://jira.lawson.com/browse/LMCLIENT-22656

[tmcconechy]

@claudenbach and @jamie-norman - i dont seem to be able to get to any of the pages on the sample links you mentioned. For all of the tickets can you please list:

• Ticket No
• Link / ID
• datagrid Settings, datagrid columns
• data in the example as JSON string

For now will look at the menu issue.

[tmcconechy]

I fixed the issue as reported and it should fix http://jira.lawson.com/browse/LMCLIENT-22369
The algorithm for resizing the page did not resize the last column very well. Added a way to test this and a fix for it. Note that some of the issue links are unconfirmed so fixing what i see on 2 assuming its all the same issue.

http://localhost:4000/components/datagrid/test-columns-auto.html?headerHamburger=true&appMenuOpen=true

• close and open the app menu
• last column should still fit
• try windows browsers

Steps necessary to review your pull request (required):
http://localhost:4000/components/datagrid/test-fixed-height-scrolling?headerHamburger=true&appMenuOpen=true

• close and open the app menu
• last column should still fit
• should still be able to scroll horizontal
• try windows browsers

http://localhost:4000/components/datagrid/test-columns-stretch-column.html?headerHamburger=true&appMenuOpen=true

• close and open the app menu
• product name column should still stretch
• should be no scrolling
• try windows browsers

Other notes:

• it was possible to use redrawOnResize option but its a bit more expensive than this solution so made this the default (possible workaround for older versions)

With the other linked issues, please make a new issue if they are not the same issue.

[brianjuan]

• https://4140-beta0-enterprise.demo.design.infor.com/components/datagrid/test-columns-auto.html?headerHamburger=true&appMenuOpen=true
• https://4140-beta0-enterprise.demo.design.infor.com/components/datagrid/test-fixed-height-scrolling?headerHamburger=true&appMenuOpen=true
• https://4140-beta0-enterprise.demo.design.infor.com/components/datagrid/test-columns-stretch-column.html?headerHamburger=true&appMenuOpen=true

Passed QA testing on all browsers.

[jamie-norman]

These look pretty good. The only issue I see is when you resize the browser window and don't reload the screen. I realize that's a less likely use case, but there's still some minor rendering issues in those situations.

[tmcconechy]

Yeah i think the only case there is if the screen starts out smaller than the columns fit. Then you resize bigger. In that case its not doing the stretch on the last column. I think we could look a bit more into that case.