This is a squash of several commits, due to each fix causing subsequent issues. 1. feat: createListPicker() is now synchronous How to test: No functional change expected. Custom service icon list-picker (in project admin > Services) still functions as before. When you create a new project, the privacy list-picker still functions as before. The custom template list-pickers in tlp-doc function as before. Notes: Asynchronous template option was never used. We can figure out how to add it later if it is needed. For now, having an asynchronous list-picker constructor causes problems for list fields in the artifact-modal. It means list-picker starts observing changes on its <select> element too late. This causes a race condition with field dependencies management. 2. fix: roadmap configure widget modal empty trackers How to test: Roadmap configure widget modal should show the existing "track progress of" trackers. It should not be an empty list-picker. Notes: This was revealed by making createListPicker synchronous. Instead of assigning empty and then assigning props value, we just assign props value. 3. fix: list-picker should not trigger changes by itself How to test: The tracker "Move artifact" modal should load the trackers of the current project when it is shown for the first time. Notes: At init and when refreshing due to a mutation of its underlying <select> or <option> tags, list-picker no longer dispatches a "change" event. The caller of list-picker is expected to handle such changes by themselves. List-picker is a thin wrapper over a <select> element and should only dispatch "change" events for user interactions: selecting an item, unselecting an item, clearing the selection. In no other circumstance should it dispatch "change" events. 4. fix: List-picker no longer tries to select the first available value when refreshing How to test: - In program management admin, when I select a program increments tracker, the list-picker for iterations tracker has one fewer option but it does not select automatically the first tracker. When I select an iterations tracker, the program increments list-picker has one fewer option. - The roadmap configure widget modal (and other list-pickers in Vue) should not freeze the browser with an infinite loop consuming 100% CPU and memory. Notes: In Single selection, list-picker no longer tries to select the first available value when refreshing due to a mutation of its underlying <select> or <option> tags. This change means the `keep_none_value` option is now useless and deleted (it is the default behaviour now). Dispatching "change" event at init and when refreshing would cause Vue to re-render the list of options, and since 5949f86df59f7f1149159f03183cb051bf84ce2e, list-picker also watches "value" attributes on options. This creates an infinite loop of vue render -> dispatch change -> vue re-render. To break this loop, list-picker must not select anything by itself when refreshing. It can only dispatch "change" events when the user actually did something. 5. fix: Field dependencies stop clearing selected values in the modal How to test: The tracker artifact modal field dependencies no longer clear the target field selected items. Given a chain of dependencies: A -> B -> C, if I change the value of A: - if the values selected in B are still available, they stay selected. C does the same depending on the selected values of B. - if they are no longer available, B is empty. C is also empty as a result. With field dependencies on single-selection select boxes, in artifact view, B is empty but C still has values. This is wrong, but is the existing behaviour (written in PrototypeJS, so few hopes of being fixed). Notes: Previously, there was a conflict between list-picker, trying to select the first available value on its own, and the AngularJS watcher, trying to empty the selected values _unless_ there was only one available, in which case it would select it. Somehow, this conflict settled at some point, but it was probably not the right behaviour. Now, list-picker only reflects the value and options of its underlying <select>. Instead of clearing the selected values, we should let the ones still available remain selected, and clear the ones that are no longer available. This makes the modal behaviour aligned with the one of the artifact view. part of request #22648 Convert AngularJS directives and controllers to hybrids web components fix request #30359 roadmap widget configuration freezes browser tab Change-Id: Ia8bec7fe698a1371a685aeb42121abd6af44daa3

+567 −623

Author

Joris MASSON (jmasson) 2023-01-10 16:23

Committer

Joris MASSON (jmasson) 2023-01-16 09:40

Hash a4aa0b4475ef5ddb6cd95d689c3252db4cedf94b

Parent 895f7daad318eb7cdea2c0986f20a1c0f1d50cb5

Reference git #tuleap/stable/a4aa0b4475ef5ddb6cd95d689c3252db4cedf94b