Created attachment 1548684 [details] The screenshot to illustrate what happens. Description of problem: When you try to edit items, such as flavor in Create Migration Plan the confirmation tick-mark is displayed on a wrong list item. This happens if the list is displaying more than 5 items Version-Release number of selected component (if applicable): How reproducible: Everytime Steps to Reproduce: Switch the table to 10 rows from 5, and try to edit something Actual results: The tick mark is displayed much lower, sometimes outside of the frame completely Expected results: The confirmation button/tick mark should be displayed right below the item being edited, as is the case when the table has only 5 rows displayed. Additional info:
What messes up the button placement here is the scrollbar. Once you scroll down a bit, the confirmation buttons are rendered in the position as if the scrollbar was all the way up.
This still does sound weird that you have to scroll to fix the rendering. It should work from the start. Isn't there any thing that can be done from UI code standpoint ?
I did not suggest to scroll to fix the button position, it was just an exaplanation of the situation. We're currently discussing our options to fix this problem.
That's not what I had understood neither. My fear was that it's a browser / JS framework issue that can only be fixed on an external component. Sorry if it sounded rough.
In truth, yes, this is a bug in patternfly [1] We were discussing using a slightly different approach to implement the in-line table editing, one where we could avoid using the buggy patternfly implementation. We could try to fix patternfly here, but it would be a long shot (probably). > Sorry if it sounded rough. Not at all :-) [1] https://github.com/patternfly/patternfly-react/issues/535
https://github.com/ManageIQ/manageiq-v2v/pull/937
The PR above (#937) was closed and replaced by this PR: https://github.com/ManageIQ/manageiq-v2v/pull/941
New commit detected on ManageIQ/manageiq-v2v/master: https://github.com/ManageIQ/manageiq-v2v/commit/3591a1c6dc79bc0b795fecc3357dda166c7502ec commit 3591a1c6dc79bc0b795fecc3357dda166c7502ec Author: Milan Zazrivec <mzazrivec> AuthorDate: Tue Apr 16 13:25:55 2019 -0400 Commit: Milan Zazrivec <mzazrivec> CommitDate: Tue Apr 16 13:25:55 2019 -0400 Fix table inline edit buttons positioning https://bugzilla.redhat.com/show_bug.cgi?id=1693382 app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardInstancePropertiesStep/PlanWizardInstancePropertiesStep.scss | 8 +- app/javascript/react/screens/App/Overview/screens/PlanWizard/components/PlanWizardInstancePropertiesStep/components/TableInlineEditRow/TableConfirmButtonsRow.js | 96 +- 2 files changed, 22 insertions(+), 82 deletions(-)
Fixed! Verified on: 5.11.0.8.20190611155126_01e077e (Tracker: 5.11 ON_QA day, Thanks Ganesh)