[iOS] Multiple select appearance doesn't update when selecting or deselecting rows...
authorwenson_hsieh@apple.com <wenson_hsieh@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 28 Mar 2018 22:03:04 +0000 (22:03 +0000)
committerwenson_hsieh@apple.com <wenson_hsieh@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 28 Mar 2018 22:03:04 +0000 (22:03 +0000)
https://bugs.webkit.org/show_bug.cgi?id=184110
<rdar://problem/38796648>

Reviewed by Tim Horton.

Source/WebCore:

HTMLSelectElement::optionSelectedByUser is invoked upon user interaction with a select menu. This currently
takes two separate codepaths, depending on whether or not the menu list appearance is being used to render the
select. If a menu list appearance is used, we call selectOption(), which updates validity, updates the element
renderer, and then dispatches a `change` event if needed.

However, if updateSelectedState() is used, we only update form validity and then dispatch the `change` event
without updating the renderer, leaving it stale.

Test: fast/forms/ios/ipad/multiple-select-updates-renderer.html

* html/HTMLSelectElement.cpp:
(WebCore::HTMLSelectElement::optionSelectedByUser):

Update the renderer after updating the DOM to reflect the selected option.

LayoutTests:

Adds a new layout test to verify that after tapping on a multiple select and choosing an option, the select's
renderer is updated to reflect its new state.

* fast/forms/ios/ipad/multiple-select-updates-renderer-expected.txt: Added.
* fast/forms/ios/ipad/multiple-select-updates-renderer.html: Added.
* resources/basic-gestures.js:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@230055 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/fast/forms/ios/ipad/multiple-select-updates-renderer-expected.txt [new file with mode: 0644]
LayoutTests/fast/forms/ios/ipad/multiple-select-updates-renderer.html [new file with mode: 0644]
LayoutTests/resources/basic-gestures.js
Source/WebCore/ChangeLog
Source/WebCore/html/HTMLSelectElement.cpp

index e4af69a..23ec1c4 100644 (file)
@@ -1,3 +1,18 @@
+2018-03-28  Wenson Hsieh  <wenson_hsieh@apple.com>
+
+        [iOS] Multiple select appearance doesn't update when selecting or deselecting rows in the picker view
+        https://bugs.webkit.org/show_bug.cgi?id=184110
+        <rdar://problem/38796648>
+
+        Reviewed by Tim Horton.
+
+        Adds a new layout test to verify that after tapping on a multiple select and choosing an option, the select's
+        renderer is updated to reflect its new state.
+
+        * fast/forms/ios/ipad/multiple-select-updates-renderer-expected.txt: Added.
+        * fast/forms/ios/ipad/multiple-select-updates-renderer.html: Added.
+        * resources/basic-gestures.js:
+
 2018-03-28  Per Arne Vollan  <pvollan@apple.com>
 
         Mark http/tests/preload/download_resources.html as a flaky crash on Windows.
diff --git a/LayoutTests/fast/forms/ios/ipad/multiple-select-updates-renderer-expected.txt b/LayoutTests/fast/forms/ios/ipad/multiple-select-updates-renderer-expected.txt
new file mode 100644 (file)
index 0000000..aa44e7c
--- /dev/null
@@ -0,0 +1,2 @@
+
+PASS
diff --git a/LayoutTests/fast/forms/ios/ipad/multiple-select-updates-renderer.html b/LayoutTests/fast/forms/ios/ipad/multiple-select-updates-renderer.html
new file mode 100644 (file)
index 0000000..b6e71bf
--- /dev/null
@@ -0,0 +1,61 @@
+<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
+<html>
+<head>
+<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
+<style>
+    body, html {
+        width: 100%;
+        height: 100%;
+        margin: 0;
+    }
+    select {
+        width: 200px;
+        height: 200px;
+    }
+</style>
+<script src="../../../../resources/basic-gestures.js"></script>
+<script>
+    async function run()
+    {
+        if (!window.testRunner)
+            return;
+
+        await tapAtPoint(100, 100);
+        await selectFormAccessoryPickerRow(0);
+        doneEvaluatingUIScript = true;
+        checkDone();
+    }
+
+    function checkDone()
+    {
+        if (window.doneEvaluatingUIScript && window.valueChanged && window.testRunner)
+            testRunner.notifyDone();
+    }
+</script>
+</head>
+<body onload="run()">
+    <select multiple id="select"><option>This is an option.</option></select>
+    <pre id="output"></pre>
+</body>
+<script>
+    select.addEventListener("change", () => {
+        if (window.internals) {
+            const renderTreeAsText = internals.elementRenderTreeAsText(document.documentElement);
+            const expectedOptionValue = "This is an option.";
+            if (renderTreeAsText.indexOf(expectedOptionValue) != -1)
+                output.textContent = "PASS";
+            else
+                output.textContent = `FAIL: expected '${expectedOptionValue}' in render tree dump:\n${renderTreeAsText}`;
+        }
+
+        select.blur();
+        valueChanged = true;
+        checkDone();
+    });
+
+    if (window.testRunner) {
+        testRunner.waitUntilDone();
+        testRunner.dumpAsText();
+    }
+</script>
+</html>
index c9659a4..9d46d2c 100644 (file)
@@ -140,6 +140,12 @@ function touchAndDragFromPointToPoint(startX, startY, endX, endY)
     });
 }
 
+function selectFormAccessoryPickerRow(rowIndex)
+{
+    const selectRowScript = `(() => uiController.selectFormAccessoryPickerRow(${rowIndex}))()`;
+    return new Promise(resolve => testRunner.runUIScript(selectRowScript, resolve));
+}
+
 function holdAtPoint(x, y)
 {
     return new Promise(resolve => {
index 800c304..0d1bbca 100644 (file)
@@ -1,3 +1,26 @@
+2018-03-28  Wenson Hsieh  <wenson_hsieh@apple.com>
+
+        [iOS] Multiple select appearance doesn't update when selecting or deselecting rows in the picker view
+        https://bugs.webkit.org/show_bug.cgi?id=184110
+        <rdar://problem/38796648>
+
+        Reviewed by Tim Horton.
+
+        HTMLSelectElement::optionSelectedByUser is invoked upon user interaction with a select menu. This currently
+        takes two separate codepaths, depending on whether or not the menu list appearance is being used to render the
+        select. If a menu list appearance is used, we call selectOption(), which updates validity, updates the element
+        renderer, and then dispatches a `change` event if needed.
+
+        However, if updateSelectedState() is used, we only update form validity and then dispatch the `change` event
+        without updating the renderer, leaving it stale.
+
+        Test: fast/forms/ios/ipad/multiple-select-updates-renderer.html
+
+        * html/HTMLSelectElement.cpp:
+        (WebCore::HTMLSelectElement::optionSelectedByUser):
+
+        Update the renderer after updating the DOM to reflect the selected option.
+
 2018-03-28  Daniel Bates  <dabates@apple.com>
 
         Substitute "strong password confirmation auto fill" for "strong confirmation password auto fill"
index 0a8602e..6213dbd 100644 (file)
@@ -117,6 +117,8 @@ void HTMLSelectElement::optionSelectedByUser(int optionIndex, bool fireOnChangeN
     if (!usesMenuList()) {
         updateSelectedState(optionToListIndex(optionIndex), allowMultipleSelection, false);
         updateValidity();
+        if (auto* renderer = this->renderer())
+            renderer->updateFromElement();
         if (fireOnChangeNow)
             listBoxOnChange();
         return;