Web UI for editing needles is tricky to use and allows creating invalid needles

[ssssam]

I used the web UI to update a needle for a failed test. The failed test was:

https://openqa.gnome.org/tests/168#step/gnome_welcome/12

The screenshot needed updating and the green match area expanding as the window on display now fills the screen.

Using drag and drop to expand the green area to the edges is tricky, because the drag ends when the cursor crosses the edge of the screenshot. And when the cursor passes back onto the screenshot, it is still dragging the area edge even though now the mouse button is released.

Additionally, somehow invalid JSON was created and committed:

• https://gitlab.gnome.org/GNOME/openqa-needles/-/commit/a4b9fe12214e7e61390ab5ceda7d89af1f5e5fce

The new gnome_firstboot_password_2-20220923.json needle fails to match with an error:

[2022-09-23T16:38:13.717793Z] [debug] no match: -0.1s, best candidate: gnome_firstboot_password_2-20220923 (0.29)

The fix is to reduce the height of the invalid area, but ideally the web UI would guard against committing broken needles like that.

Another nice to have would be a way to edit the JSON file from the web UI directly, so that dragging the green areas isn't the only way to change them.

[Martchus]

Using drag and drop to expand the green area to the edges is tricky, because the drag ends when the cursor crosses the edge of the screenshot.

That's true. If one moves the mouse too fast out of the screenshot than the area doesn't "catch up" and is therefore not extended to the very edge of the screenshot. When moving the mouse slowly that's not a problem but releasing the drag becomes tricky because one needs still take care to keep the mouse inside the screenshot area.

The easiest workaround is to move the area to the edges first and then extend the other sides. Of course that doesn't work if the area should tangent opposing edges.

I could also reproduce the invalid needles but only in Chromium and not in Firefox. In Chromium one can indeed get 769 for ypos + height (and 768 should be the maximum). I suppose the code should explicitly ensure that needles are within the boundaries of the screenshot.

Another nice to have would be a way to edit the JSON file from the web UI directly, so that dragging the green areas isn't the only way to change them.

That's true. Currently it isn't even possible to C&P from the "Review JSON" button so this needs improvement anyways in my opinion.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.