Convert user form to React #8916

GilbertCherrie · 2023-09-11T13:11:25Z

Fixes: #6903 and #6904

Converted user form to React and added Cypress tests for the form.

Before:

Edit Admin User Form:

Add User Form:

Edit User Form:

Copy User Form:

After:

Edit Admin User Form:

Add User Form:

Edit User Form:

Copy User Form:

app/javascript/components/user-form/index.jsx

miq-bot · 2024-02-19T00:00:07Z

This pull request has been automatically marked as stale because it has not been updated for at least 3 months.

If these changes are still valid, please remove the stale label, make any changes requested by reviewers (if any), and ensure that this issue is being looked at by the assigned/reviewer(s).

kbrock · 2024-05-09T15:39:07Z

as mentioned elsewhere, passing attributes=miq_groups will bring back the groups

app/javascript/components/selected-groups-list/index.jsx

miq-bot · 2025-04-10T21:45:52Z

This pull request is not mergeable. Please rebase and repush.

kbrock · 2025-10-27T20:36:37Z

Yay. can @elsamaryv merge, or do you need someone else to pull the trigger?

GilbertCherrie · 2025-10-27T20:40:36Z

@kbrock I don't think Elsa has merge rights, but also although this pr should be good I was hoping @asirvadAbrahamVarghese can fix the cypress specs first before merging

asirvadAbrahamVarghese · 2025-11-03T04:38:49Z

Let’s try this out: GilbertCherrie#1

asirvadAbrahamVarghese · 2025-11-06T10:43:59Z

Regarding the Cypress failures, we’re currently seeing two main causes:

Due to the session write issue

PR: #9533

selectAccordionItem command not finding nodes because the list is still loading

PR: #9713

Once both PRs are merged, lets re-run the test to confirm if this resolves the failures

jrafanie · 2025-11-12T17:14:06Z

Rebased this PR to pull in the sporadic test failures fixed in #9713. We can address #9533 separately.

Co-authored-by: asirvadAbrahamVarghese <[email protected]> * Rebase to master and fix suggestions * Fix cypress specs

jrafanie · 2025-11-13T19:45:34Z

cypress/e2e/ui/Settings/Application-Settings/users.cy.js

+    });
+
+    afterEach(() => {
+      cy.appDbState('restore');


Ok, the last remaining sporadic failures, other than the API version of the "undefined method downcase for nil" error caused by API requests overwriting session data used by UI requests, is that the prior navigation appears to NOT wait until the ajax report data is completed.

[----] I, [2025-11-13T11:46:07.004931#58401:f78a0] INFO -- development: Started POST "/ops/accordion_select?id=rbac_accord" for 127.0.0.1 at 2025-11-13 11:46:07 -0500 [----] I, [2025-11-13T11:46:07.016137#58401:f78a0] INFO -- development: Completed 200 OK in 9ms (Views: 0.1ms | ActiveRecord: 3.3ms (10 queries, 0 cached) | GC: 0.3ms) [----] I, [2025-11-13T11:46:07.461390#58401:f7904] INFO -- development: Started POST "/ops/tree_select?id=xx-u&text=Users" for 127.0.0.1 at 2025-11-13 11:46:07 -0500 [----] I, [2025-11-13T11:46:07.470827#58401:f7904] INFO -- development: Completed 200 OK in 7ms (Views: 0.3ms | ActiveRecord: 1.7ms (6 queries, 0 cached) | GC: 0.6ms) [----] I, [2025-11-13T11:46:07.492197#58401:f7904] INFO -- development: Started POST "/ops/report_data" for 127.0.0.1 at 2025-11-13 11:46:07 -0500 [----] I, [2025-11-13T11:46:07.505602#58401:f7904] INFO -- development: Completed 200 OK in 11ms (Views: 0.1ms | ActiveRecord: 2.3ms (15 queries, 7 cached) | GC: 0.7ms) [----] I, [2025-11-13T11:46:07.735820#58401:ef830] INFO -- development: Started POST "/ops/x_button?pressed=rbac_user_add" for 127.0.0.1 at 2025-11-13 11:46:07 -0500 [----] I, [2025-11-13T11:46:07.743649#58401:ef830] INFO -- development: Completed 200 OK in 6ms (Views: 0.2ms | ActiveRecord: 1.6ms (5 queries, 0 cached) | GC: 0.3ms) [----] I, [2025-11-13T11:46:07.767126#58401:ef830] INFO -- development: Started GET "/api/groups?&expand=resources" for 127.0.0.1 at 2025-11-13 11:46:07 -0500 [----] I, [2025-11-13T11:46:07.784709#58401:ef830] INFO -- development: Completed 200 OK in 15ms (Views: 0.0ms | ActiveRecord: 2.3ms (10 queries, 0 cached) | GC: 2.7ms) [----] I, [2025-11-13T11:46:11.422267#58401:d598] INFO -- development: Started POST "/api/users" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] I, [2025-11-13T11:46:11.454612#58401:d598] INFO -- development: Completed 200 OK in 30ms (Views: 0.0ms | ActiveRecord: 19.0ms (13 queries, 1 cached) | GC: 0.8ms) [----] I, [2025-11-13T11:46:11.560890#58401:d598] INFO -- development: Started GET "/ops/" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] I, [2025-11-13T11:46:11.566759#58401:d598] INFO -- development: Completed 302 Found in 4ms (ActiveRecord: 0.9ms (5 queries, 0 cached) | GC: 0.2ms) [----] I, [2025-11-13T11:46:11.572127#58401:d598] INFO -- development: Started GET "/ops/explorer" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] I, [2025-11-13T11:46:11.609155#58401:d598] INFO -- development: Completed 200 OK in 35ms (Views: 17.0ms | ActiveRecord: 6.6ms (21 queries, 2 cached) | GC: 1.7ms) [----] I, [2025-11-13T11:46:11.797388#58401:d598] INFO -- development: Started GET "/ws/notifications" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] I, [2025-11-13T11:46:11.799345#58401:d598] INFO -- development: Started GET "/ws/notifications" [WebSocket] for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] I, [2025-11-13T11:46:11.802006#58401:f7990] INFO -- development: Started GET "/api/notifications?expand=resources&attributes=details&sort_by=id&sort_order=desc&limit=100" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] I, [2025-11-13T11:46:11.813063#58401:f7990] INFO -- development: Completed 200 OK in 8ms (Views: 0.0ms | ActiveRecord: 2.2ms (9 queries, 0 cached) | GC: 0.3ms) [----] I, [2025-11-13T11:46:11.914043#58401:f7990] INFO -- development: Started POST "/__e2e__/command" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 [----] D, [2025-11-13T11:46:11.916749#58401:f7990] DEBUG -- development: [Cypress] Running db_state restore [----] I, [2025-11-13T11:46:11.916802#58401:f7990] INFO -- development: [Cypress] DatabaseCleaner restoring ### ^^^ restore started [----] I, [2025-11-13T11:46:11.940843#58401:f7904] INFO -- development: Started POST "/ops/report_data" for 127.0.0.1 at 2025-11-13 11:46:11 -0500 ### ^^^ likely an ajax request comes in late [----] I, [2025-11-13T11:46:11.958555#58401:f7904] INFO -- development: Completed 200 OK in 15ms (Views: 0.1ms | ActiveRecord: 3.5ms (17 queries, 7 cached) | GC: 0.3ms) [----] D, [2025-11-13T11:46:12.175919#58401:f7990] DEBUG -- development: output: [null] ### ^^^ restore finished

another example, after rbac_user_add:

[----] I, [2025-11-13T11:46:50.460788#58401:f7990] INFO -- development: Started POST "/ops/x_button?pressed=rbac_user_add" for 127.0.0.1 at 2025-11-13 11:46:50 -0500 [----] I, [2025-11-13T11:46:50.470693#58401:f7990] INFO -- development: Completed 200 OK in 7ms (Views: 0.1ms | ActiveRecord: 1.9ms (5 queries, 0 cached) | GC: 0.3ms) [----] I, [2025-11-13T11:46:50.516137#58401:f7990] INFO -- development: Started GET "/api/groups?&expand=resources" for 127.0.0.1 at 2025-11-13 11:46:50 -0500 [----] I, [2025-11-13T11:46:50.537965#58401:f7990] INFO -- development: Completed 200 OK in 19ms (Views: 0.0ms | ActiveRecord: 7.2ms (10 queries, 0 cached) | GC: 0.9ms) [----] I, [2025-11-13T11:46:54.993852#58401:f78a0] INFO -- development: Started POST "/api/users" for 127.0.0.1 at 2025-11-13 11:46:54 -0500 [----] I, [2025-11-13T11:46:55.010451#58401:f78a0] INFO -- development: Completed 200 OK in 14ms (Views: 0.0ms | ActiveRecord: 4.0ms (13 queries, 1 cached) | GC: 0.5ms) [----] I, [2025-11-13T11:46:55.194157#58401:f78a0] INFO -- development: Started GET "/ops/" for 127.0.0.1 at 2025-11-13 11:46:55 -0500 [----] I, [2025-11-13T11:46:55.202310#58401:f78a0] INFO -- development: Completed 302 Found in 5ms (ActiveRecord: 1.0ms (5 queries, 0 cached) | GC: 0.2ms) [----] I, [2025-11-13T11:46:55.207715#58401:f78a0] INFO -- development: Started GET "/ops/explorer" for 127.0.0.1 at 2025-11-13 11:46:55 -0500 [----] I, [2025-11-13T11:46:55.247468#58401:f78a0] INFO -- development: Completed 200 OK in 37ms (Views: 15.6ms | ActiveRecord: 9.6ms (21 queries, 2 cached) | GC: 1.8ms) [----] I, [2025-11-13T11:46:55.527006#58401:f7904] INFO -- development: Started GET "/ws/notifications" for 127.0.0.1 at 2025-11-13 11:46:55 -0500 [----] I, [2025-11-13T11:46:55.528850#58401:f7904] INFO -- development: Started GET "/ws/notifications" [WebSocket] for 127.0.0.1 at 2025-11-13 11:46:55 -0500 [----] I, [2025-11-13T11:46:55.529619#58401:d598] INFO -- development: Started GET "/api/notifications?expand=resources&attributes=details&sort_by=id&sort_order=desc&limit=100" for 127.0.0.1 at 2025-11-13 11:46:55 -0500 [----] I, [2025-11-13T11:46:55.541627#58401:d598] INFO -- development: Completed 200 OK in 8ms (Views: 0.0ms | ActiveRecord: 2.1ms (9 queries, 0 cached) | GC: 0.3ms) [----] I, [2025-11-13T11:46:55.647140#58401:d598] INFO -- development: Started POST "/__e2e__/command" for 127.0.0.1 at 2025-11-13 11:46:55 -0500 [----] D, [2025-11-13T11:46:55.649438#58401:d598] DEBUG -- development: [Cypress] Running db_state restore [----] I, [2025-11-13T11:46:55.649470#58401:d598] INFO -- development: [Cypress] DatabaseCleaner restoring [----] I, [2025-11-13T11:46:55.682052#58401:ef830] INFO -- development: Started POST "/ops/report_data" for 127.0.0.1 at 2025-11-13 11:46:55 -0500 ### ^^^ Another request comes in while database cleaner is restoring

another a few steps after rbac_user_add:

[----] I, [2025-11-13T11:46:00.874134#58401:ef830] INFO -- development: Started POST "/ops/x_button?pressed=rbac_user_add" for 127.0.0.1 at 2025-11-13 11:46:00 -0500 [----] I, [2025-11-13T11:46:00.888017#58401:ef830] INFO -- development: Completed 200 OK in 12ms (Views: 0.1ms | ActiveRecord: 3.8ms (5 queries, 0 cached) | GC: 0.1ms) [----] I, [2025-11-13T11:46:00.899298#58401:ef830] INFO -- development: Started GET "/api/groups?&expand=resources" for 127.0.0.1 at 2025-11-13 11:46:00 -0500 [----] I, [2025-11-13T11:46:00.917305#58401:ef830] INFO -- development: Completed 200 OK in 16ms (Views: 0.2ms | ActiveRecord: 2.4ms (10 queries, 0 cached) | GC: 0.4ms) [----] I, [2025-11-13T11:46:04.357093#58401:d598] INFO -- development: Started POST "/api/users" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.394063#58401:d598] INFO -- development: Completed 200 OK in 34ms (Views: 2.6ms | ActiveRecord: 7.9ms (13 queries, 1 cached) | GC: 0.3ms) [----] I, [2025-11-13T11:46:04.483768#58401:d598] INFO -- development: Started GET "/ops/" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.490381#58401:d598] INFO -- development: Completed 302 Found in 4ms (ActiveRecord: 1.0ms (5 queries, 0 cached) | GC: 0.1ms) [----] I, [2025-11-13T11:46:04.496137#58401:d598] INFO -- development: Started GET "/ops/explorer" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.569298#58401:d598] INFO -- development: Completed 200 OK in 71ms (Views: 31.2ms | ActiveRecord: 23.0ms (21 queries, 2 cached) | GC: 0.8ms) [----] I, [2025-11-13T11:46:04.744412#58401:d598] INFO -- development: Started GET "/ws/notifications" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.746594#58401:d598] INFO -- development: Started GET "/ws/notifications" [WebSocket] for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.748616#58401:f7904] INFO -- development: Started GET "/api/notifications?expand=resources&attributes=details&sort_by=id&sort_order=desc&limit=100" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.760454#58401:f7904] INFO -- development: Completed 200 OK in 7ms (Views: 0.0ms | ActiveRecord: 1.8ms (9 queries, 0 cached) | GC: 0.0ms) [----] I, [2025-11-13T11:46:04.813573#58401:f7904] INFO -- development: Started POST "/__e2e__/command" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] D, [2025-11-13T11:46:04.816051#58401:f7904] DEBUG -- development: [Cypress] Running db_state restore [----] I, [2025-11-13T11:46:04.816074#58401:f7904] INFO -- development: [Cypress] DatabaseCleaner restoring [----] I, [2025-11-13T11:46:04.831803#58401:f7990] INFO -- development: Started POST "/ops/report_data" for 127.0.0.1 at 2025-11-13 11:46:04 -0500 [----] I, [2025-11-13T11:46:04.847168#58401:f7990] INFO -- development: Completed 200 OK in 12ms (Views: 0.1ms | ActiveRecord: 2.4ms (17 queries, 7 cached) | GC: 0.0ms) [----] D, [2025-11-13T11:46:05.033555#58401:f7904] DEBUG -- development: output: [null]

Ultimately, I think the restore needs to have a global lock preventing other threads from handling requests while it's restoring but in the short term, I believe if we track down the sequence here, we can probably resolve the issue in this cypress test by ensuring the report_data intercept and wait is done. cc @asirvadAbrahamVarghese

Note, I used this grep to search my logs for the output above:

grep -E "Started|Completed|output:|Cypress" log/development.log

Note, it looks like we can make the rails rack app thread unsafe in cypress, forcing all requests to be handled serially, by doing something like this:

diff --git a/config/initializers/cypress_on_rails.rb b/config/initializers/cypress_on_rails.rb index 64281bb628..f473dd12ac 100644 --- a/config/initializers/cypress_on_rails.rb +++ b/config/initializers/cypress_on_rails.rb @@ -54,4 +54,6 @@ if ENV['CYPRESS'].present? # end require 'extensions/database_cleaner-activerecord-seeded_deletion' DatabaseCleaner[:active_record].strategy = DatabaseCleaner::ActiveRecord::SeededDeletion.new(:pre_count => true) + + Rails.application.config.middleware.insert_before 0, Rack::Lock end

I tested with this locally @asirvadAbrahamVarghese and it seems to pass all tests. I don't know though since this PR locally doesn't fail every time (without the Rack::Lock).

Ultimately, we either need to make things run serially, using something like Rack::Lock or make our app and test code thread safe.

After discussing it today, we need to intercept and wait on ajax requests. If we use Rack::Lock, there's still a chance thread 1 starts test teardown by doing the restore, but then when it finishes, the remaining ajax request then comes in through thread 2... that could cause the next test to fail if it wasn't expected that activity. So, the current test needs to wait on the POST "/ops/report_data", perhaps only when adding a user, before moving on to ensure it's run before the test teardown and within the correct test.

GilbertCherrie requested a review from a team as a code owner September 11, 2023 13:11

miq-bot added the wip label Sep 11, 2023

jeffibm reviewed Sep 11, 2023

View reviewed changes

app/javascript/components/user-form/index.jsx Outdated Show resolved Hide resolved

jeffibm reviewed Sep 11, 2023

View reviewed changes

app/javascript/components/user-form/index.jsx Outdated Show resolved Hide resolved

jeffibm reviewed Sep 11, 2023

View reviewed changes

app/javascript/components/user-form/index.jsx Outdated Show resolved Hide resolved

jeffibm mentioned this pull request Sep 12, 2023

[WIP]Settings users form conversion #8797

Closed

GilbertCherrie force-pushed the convert_user_form branch from 2ae26b7 to 4a1034b Compare September 12, 2023 21:09

GilbertCherrie force-pushed the convert_user_form branch 2 times, most recently from a959e72 to ffd13db Compare October 2, 2023 19:51

GilbertCherrie added the enhancement label Oct 2, 2023

GilbertCherrie force-pushed the convert_user_form branch 5 times, most recently from 444bd81 to 0b91982 Compare October 6, 2023 15:54

GilbertCherrie mentioned this pull request Oct 24, 2023

Phase 2: Cypress Tests #8859

Open

15 tasks

miq-bot added the unmergeable label Nov 17, 2023

miq-bot added the stale label Feb 19, 2024

GilbertCherrie force-pushed the convert_user_form branch 3 times, most recently from f181f47 to 55e116c Compare May 6, 2024 16:43

miq-bot removed the unmergeable label May 8, 2024

GilbertCherrie changed the title ~~[WIP] Convert user form to React~~ Convert user form to React May 27, 2024

GilbertCherrie removed wip stale labels May 27, 2024

GilbertCherrie force-pushed the convert_user_form branch 3 times, most recently from d34575a to 63b757b Compare May 27, 2024 20:13

GilbertCherrie removed the stale label Mar 26, 2025

elsamaryv reviewed Mar 27, 2025

View reviewed changes

app/javascript/components/selected-groups-list/index.jsx Outdated Show resolved Hide resolved

elsamaryv reviewed Mar 27, 2025

View reviewed changes

app/javascript/components/selected-groups-list/index.jsx Outdated Show resolved Hide resolved

GilbertCherrie force-pushed the convert_user_form branch from d37ccfd to 6335671 Compare April 9, 2025 16:55

miq-bot added the unmergeable label Apr 10, 2025

GilbertCherrie added the react label Jun 13, 2025

GilbertCherrie force-pushed the convert_user_form branch from 6335671 to d49dcce Compare October 8, 2025 20:04

GilbertCherrie removed the unmergeable label Oct 8, 2025

GilbertCherrie requested a review from elsamaryv October 22, 2025 17:51

GilbertCherrie force-pushed the convert_user_form branch from d49dcce to 0cdfa47 Compare October 22, 2025 17:53

elsamaryv approved these changes Oct 24, 2025

View reviewed changes

GilbertCherrie force-pushed the convert_user_form branch 2 times, most recently from cd3a66e to 2a03fb0 Compare November 5, 2025 14:24

asirvadAbrahamVarghese mentioned this pull request Nov 6, 2025

Enhanced selectAccordionItem to wait for items to load before proceeding #9713

Merged

kbrock assigned jrafanie Nov 12, 2025

asirvadAbrahamVarghese mentioned this pull request Nov 12, 2025

Users form cypress refactor GilbertCherrie/manageiq-ui-classic#1

Open

Convert user form to react

aa71eee

jrafanie force-pushed the convert_user_form branch from 2a03fb0 to aa71eee Compare November 12, 2025 17:13

jrafanie force-pushed the convert_user_form branch from eb75a30 to 4029110 Compare November 12, 2025 18:37

Refactor users form cypress test

0071f31

Co-authored-by: asirvadAbrahamVarghese <[email protected]> * Rebase to master and fix suggestions * Fix cypress specs

jrafanie force-pushed the convert_user_form branch from 4029110 to 0071f31 Compare November 12, 2025 18:38

jrafanie closed this Nov 12, 2025

jrafanie reopened this Nov 12, 2025

jrafanie reviewed Nov 13, 2025

View reviewed changes

Convert user form to React #8916

Are you sure you want to change the base?

Convert user form to React #8916

Uh oh!

Conversation

GilbertCherrie commented Sep 11, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

miq-bot commented Feb 19, 2024

Uh oh!

kbrock commented May 9, 2024

Uh oh!

Uh oh!

Uh oh!

miq-bot commented Apr 10, 2025

Uh oh!

kbrock commented Oct 27, 2025

Uh oh!

GilbertCherrie commented Oct 27, 2025

Uh oh!

asirvadAbrahamVarghese commented Nov 3, 2025

Uh oh!

asirvadAbrahamVarghese commented Nov 6, 2025

Uh oh!

jrafanie commented Nov 12, 2025

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 13, 2025

Choose a reason for hiding this comment

Uh oh!

jrafanie Nov 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

GilbertCherrie commented Sep 11, 2023 •

edited

Loading

jrafanie Nov 14, 2025 •

edited

Loading