[prev in list] [next in list] [prev in thread] [next in thread]
List: webkit-unassigned
Subject: [Webkit-unassigned] [Bug 235911] New: Select on iPad doesn't refresh dropdown UI after an option is
From: bugzilla-daemon () webkit ! org
Date: 2022-01-31 21:19:50
Message-ID: bug-235911-2851 () https ! bugs ! webkit ! org/
[Download RAW message or body]
--1643663990.7Ad76DC26.3758
Date: Mon, 31 Jan 2022 13:19:50 -0800
MIME-Version: 1.0
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable
X-Bugzilla-URL: https://bugs.webkit.org/
Auto-Submitted: auto-generated
https://bugs.webkit.org/show_bug.cgi?id=235911
Bug ID: 235911
Summary: Select on iPad doesn't refresh dropdown UI after an
option is removed
Product: WebKit
Version: Safari 15
Hardware: iPhone / iPad
OS: iOS 15
Status: NEW
Severity: Critical
Priority: P2
Component: Layout and Rendering
Assignee: webkit-unassigned@lists.webkit.org
Reporter: m.goleb+bugzilla@gmail.com
CC: bfulgham@webkit.org, simon.fraser@apple.com,
zalan@apple.com
This is an issue reported as happening in the wild on a project using AngularJS. \
AngularJS is EOL now and will not see a new release. Unless iPad Safari is fixed, \
this will forever stay broken in the official AngularJS.
On an iPad with the latest iPadOS 15.3, if you have a `<select>` element on the page \
and you perform the following steps: 1. Open the select dropdown by clicking on it \
(then optionally close it, it doesn't matter) 2. Programmatically remove an option by \
invoking `select.remove(0)` 3. Open the select dropdown again
you'll see that the dropdown still shows all the original options despite the select \
DOM being properly updated.
When that issue happens, it's sometimes very hard to force Safari to update the UI \
state properly. Opening the same select dropdown repeatedly doesn't update it. Some \
CSS actions like setting the select height help but only if the dropdown is opened \
after this height update so programmatic workarounds like "set select height to 10px, \
force style recalc, reset select height" don't work. If you have multiple select \
elements on the page and you open another one, the UI state cache is apparently \
cleared and opening the first select now shows the correct options. Again, this is \
not something that can be done programmatically by a library.
Weirdly, this only happens on iPad. It works fine on macOS & on an iPhone. On an \
iPad, it happens both on a real device (tested on iPad 9th generation) on iPadOS 15.3 \
and on an iPad Pro (11-inch) simulator with iPadOS 15.2. I was also able to reproduce \
on an iPadOS 14.5 simulator but not on the iPadOS 13.5 one.
A live test case: Test case showing the issue: https://output.jsbin.com/fihujuq/8.
The AngularJS issue: https://github.com/angular/angular.js/issues/17168
--
You are receiving this mail because:
You are the assignee for the bug.
--1643663990.7Ad76DC26.3758
Date: Mon, 31 Jan 2022 13:19:50 -0800
MIME-Version: 1.0
Content-Type: text/html; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable
X-Bugzilla-URL: https://bugs.webkit.org/
Auto-Submitted: auto-generated
<html>
<head>
<base href="https://bugs.webkit.org/">
</head>
<body><table border="1" cellspacing="0" cellpadding="8">
<tr>
<th>Bug ID</th>
<td><a class="bz_bug_link
bz_status_NEW "
title="NEW - Select on iPad doesn't refresh dropdown UI after an option is \
removed" href="https://bugs.webkit.org/show_bug.cgi?id=235911">235911</a>
</td>
</tr>
<tr>
<th>Summary</th>
<td>Select on iPad doesn't refresh dropdown UI after an option is removed
</td>
</tr>
<tr>
<th>Product</th>
<td>WebKit
</td>
</tr>
<tr>
<th>Version</th>
<td>Safari 15
</td>
</tr>
<tr>
<th>Hardware</th>
<td>iPhone / iPad
</td>
</tr>
<tr>
<th>OS</th>
<td>iOS 15
</td>
</tr>
<tr>
<th>Status</th>
<td>NEW
</td>
</tr>
<tr>
<th>Severity</th>
<td>Critical
</td>
</tr>
<tr>
<th>Priority</th>
<td>P2
</td>
</tr>
<tr>
<th>Component</th>
<td>Layout and Rendering
</td>
</tr>
<tr>
<th>Assignee</th>
<td>webkit-unassigned@lists.webkit.org
</td>
</tr>
<tr>
<th>Reporter</th>
<td>m.goleb+bugzilla@gmail.com
</td>
</tr>
<tr>
<th>CC</th>
<td>bfulgham@webkit.org, simon.fraser@apple.com, \
zalan@apple.com </td>
</tr></table>
<p>
<div>
<pre>This is an issue reported as happening in the wild on a project using \
AngularJS. AngularJS is EOL now and will not see a new release. Unless iPad Safari is \
fixed, this will forever stay broken in the official AngularJS.
On an iPad with the latest iPadOS 15.3, if you have a `<select>` element on the \
page and you perform the following steps: 1. Open the select dropdown by clicking on \
it (then optionally close it, it doesn't matter) 2. Programmatically remove an option \
by invoking `select.remove(0)` 3. Open the select dropdown again
you'll see that the dropdown still shows all the original options despite the select \
DOM being properly updated.
When that issue happens, it's sometimes very hard to force Safari to update the UI \
state properly. Opening the same select dropdown repeatedly doesn't update it. Some \
CSS actions like setting the select height help but only if the dropdown is opened \
after this height update so programmatic workarounds like "set select height to \
10px, force style recalc, reset select height" don't work. If you have multiple \
select elements on the page and you open another one, the UI state cache is \
apparently cleared and opening the first select now shows the correct options. Again, \
this is not something that can be done programmatically by a library.
Weirdly, this only happens on iPad. It works fine on macOS & on an iPhone. On an \
iPad, it happens both on a real device (tested on iPad 9th generation) on iPadOS 15.3 \
and on an iPad Pro (11-inch) simulator with iPadOS 15.2. I was also able to reproduce \
on an iPadOS 14.5 simulator but not on the iPadOS 13.5 one.
A live test case: Test case showing the issue: <a \
href="https://output.jsbin.com/fihujuq/8">https://output.jsbin.com/fihujuq/8</a>.
The AngularJS issue: <a \
href="https://github.com/angular/angular.js/issues/17168">https://github.com/angular/angular.js/issues/17168</a></pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>
--1643663990.7Ad76DC26.3758--
_______________________________________________
webkit-unassigned mailing list
webkit-unassigned@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-unassigned
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic