172567 2017-05-24 17:57:11 -0700 Safari autofill doesn't work in form inputs that are in a shadow root 2023-06-14 10:19:38 -0700 1 1 1 Unclassified WebKit Forms WebKit Nightly Build All All RESOLVED FIXED https://bugs.webkit.org/show_bug.cgi?id=218507 https://bugs.webkit.org/show_bug.cgi?id=203299 InRadar P2 Normal --- 148695 1 webkit rmondello ben.hirsch cdumez daniel.ehrhardt iau87 jberlin ldebeasi martincarstens maxwell.benton mnicpt peter.koshelev rmondello rniwa spatel2 ssheldon tomerlichtash webkit-bug-importer wenson_hsieh wwalter oldest_to_newest 1312466 0 webkit 2017-05-24 17:57:11 -0700 Autofill for form input fields such as credit card fields, email addresses, etc. doesn't appear to work for form inputs that are inside shadow roots. Reproduction: 1) Go to polymer-shop2.appspot.com 2) Tap on "men's outerwear" 3) Tap on "Men's tech shell full-zip" 4) Tap on "Add to cart" 5) Tap on the cart icon on the upper right 6) Tap on "Checkout" 7) Tap in the "Email" field Expected: The autofill selector should appear to enable you to autofill from a contact. Result: No autofill appears supported. This is also the case for other fields I'd expect to autofill, like "Card Number" 1312522 1 webkit-bug-importer 2017-05-24 21:02:28 -0700 <rdar://problem/32394943> 1813562 2 ssheldon 2021-11-10 05:58:03 -0800 I have tried this in iOS 15.1 and this issue is still not fixed. This is a critical feature for many developers, is there any way to get an estimate on a fix? Or at the very lease a temporary work around or solution we can use in the mean time? Any update or assistance you can give will be helpful, thanks! 1815949 3 ssheldon 2021-11-17 08:23:33 -0800 Any update on this issue? 1844641 4 peter.koshelev 2022-02-22 04:10:59 -0800 Same issue, when is it expected to be fixed!? it's 5th year already 1880430 5 daniel.ehrhardt 2022-07-03 13:33:49 -0700 Safari is the new Internet Explorer. 1883008 6 460859 ldebeasi 2022-07-13 08:53:31 -0700 Created attachment 460859 Code reproduction I am attaching a new code reproduction as the link in the initial post is broken. Is there anything else we can do to help get this issue resolved? Steps to reproduce: 1. Open reproduction on an iOS device. 2. Tap into any of the inputs in the "Native" section. Observe that the autofill/passwords button appears above the keyboard. 3. Tap into any of the inputs in the "Web Component + Shadow DOM" section. Observe that the autofill/passwords button does not appear above the keyboard. 4. Tap into any of the inputs in the "Web Component + Light DOM" section. Observe that the autofill/passwords button appears above the keyboard. Expected Behavior: I expect that the autofill button will appear regardless of the Shadow DOM. Actual Behavior: The autofill button only appears on inputs in the light DOM. 1898423 7 iau87 2022-09-14 02:54:16 -0700 Please fix this bug🙏 1922616 8 ben.hirsch 2023-01-03 07:18:58 -0800 Any update on the progress of this? Autofill is supported by other browser makers. Looks like there is some progress in Chromium: https://chromestatus.com/feature/5769419581030400 Does webkit have any plans to support? Seems like a pretty important feature. 1923060 9 rmondello 2023-01-04 18:14:37 -0800 Fixing this actually requires a Safari change, not a WebKit change. I will report back to this bug when a fix for this is testable in Safari Technology Preview. 1923577 10 martincarstens 2023-01-06 13:10:45 -0800 Would love to see support for this. We've had great feedback from clients moving away from remotely hosted iframes and re-implementing in client-hosted Shadow DOMs, but cannot recommend Safari on Mac over Chrome as a result of lacking autofill support. On iOS, Safari performs better than the Chrome WebKit wrapper. Unlike Chrome, Safari can tab input fields and toggle the virtual keyboard. Unfortunately neither browser does autofill. 1923578 11 rniwa 2023-01-06 13:13:20 -0800 It would be really helpful for people commenting here to post URLs of websites that this bug affects. 1928294 12 rmondello 2023-01-25 15:20:46 -0800 Hi folks! This is resolved in Safari Technology Preview 162. At least, I made a code change in Safari that I *believe* resolves it. (I used the reproduction attached by Liam DeBeasi to test.) Can all of y’all who care about this issue give your web content a spin with Safari Technology Preview 162 and report back about whether the AutoFill issue is resolved or not? I’d really appreciate that, and I also appreciate your patience. 1928398 13 martincarstens 2023-01-25 19:29:11 -0800 Confirmed working in Safari Technology Preview Release 162 (Safari 16.4, WebKit 18615.1.18.2) on MacOS Ventura. Is there a way to test this on iOS? Thank you, Ricky!! 1929384 14 rmondello 2023-01-30 07:10:36 -0800 > Is there a way to test this on iOS? Not at this time. I’ll try to bump this bug once the fix is testable in an iOS beta. 1939486 15 mnicpt 2023-03-07 09:51:47 -0800 Ricky, How long does it usually take for the fix in Safari Technology Preview to show up in Safari? 1939499 16 rmondello 2023-03-07 10:43:35 -0800 macOS Ventura 13.3, iOS 16.4, and iPadOS 16.4 contain this fix. 1942824 17 spatel2 2023-03-21 07:30:18 -0700 Ricky, thank you so much for this fix! We noticed when building nested web components each with their own shadowDOM trees, that autofill still doesn't work. Have you tested for this use case? It occurs quite often if you're building a web components using something like Lit or StencilJS 1942897 18 rmondello 2023-03-21 12:24:07 -0700 Thanks Sunny! > We noticed when building nested web components each with their own shadowDOM trees, that autofill still doesn't work. Have you tested for this use case? It occurs quite often if you're building a web components using something like Lit or StencilJS I’m very motivated to get this fixed. Do you think you could create some kind of reduced test case, ideally a single HTML file, and attach it to this bug? That way, I’ll have something that represents exactly what you’d like to see work. 1943090 19 spatel2 2023-03-22 07:27:19 -0700 Ricky, My apologies looks like it is fixed as well. Here's the test is used: https://9tmy5w-3333.csb.app Worked fine in technology preview version, Release 165 (Safari 16.4, WebKit 18616.1.4.4). Thanks! 1943100 20 rmondello 2023-03-22 08:29:14 -0700 I’m so happy to hear that! 1957894 21 maxwell.benton 2023-05-25 06:53:55 -0700 Hello Ricky, I can open a separate ticket if you prefer, but one-time-code autofill in the shadow DOM still appears to not be fully working after testing on Safari 16.4 and now 16.5. Here is an example with a minimal shadow DOM component alongside a regular HTML input for comparison: https://playcode.io/1482887 As of iOS 16.4, the code autofill suggestion now appears for the shadow DOM input, but clicking on the suggestion does not populate the element with the code. 1957911 22 rmondello 2023-05-25 08:56:36 -0700 Hi Maxwell. You’ll find that this is fixed in the betas of Safari Version 16.6, as well as in Safari Technology Preview. 1961577 23 rniwa 2023-06-14 10:19:38 -0700 *** Bug 257804 has been marked as a duplicate of this bug. *** 460859 2022-07-13 08:53:31 -0700 2022-07-13 08:53:31 -0700 Code reproduction index.html text/html 2553 ldebeasi PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPG1ldGEgY2hhcnNldD0iVVRGLTgi IC8+CiAgICA8dGl0bGU+U2hhZG93IERPTSAtIEF1dG9maWxsPC90aXRsZT4KICAgIDxtZXRhCiAg ICAgIG5hbWU9InZpZXdwb3J0IgogICAgICBjb250ZW50PSJ3aWR0aD1kZXZpY2Utd2lkdGgsIGlu aXRpYWwtc2NhbGU9MS4wLCBtaW5pbXVtLXNjYWxlPTEuMCIKICAgIC8+CiAgICA8c3R5bGU+CiAg ICAgIGlucHV0IHsKICAgICAgICBmb250LXNpemU6IDE2cHg7CiAgICAgIH0KICAgIDwvc3R5bGU+ CiAgPC9oZWFkPgoKCiAgPGJvZHk+CiAgICA8Zm9ybT4KICAgICAgPGgxPk5hdGl2ZTwvaDE+CiAg ICAgIDxpbnB1dCB0eXBlPSJlbWFpbCIgbmFtZT0iZW1haWwiIHBsYWNlaG9sZGVyPSJuYXRpdmUg ZW1haWwiIC8+IDxiciAvPgogICAgICA8aW5wdXQgYXV0b2NvbXBsZXRlPSJwYXNzd29yZCIgdHlw ZT0icGFzc3dvcmQiIG5hbWU9InBhc3N3b3JkIiBwbGFjZWhvbGRlcj0ibmF0aXZlIHBhc3N3b3Jk IiAvPiA8YnIgLz4KICAgIDwvZm9ybT4KICAgIAogICAgPGZvcm0+CiAgICAgIDxoMT5XZWIgQ29t cG9uZW50ICsgU2hhZG93IERPTTwvaDE+CiAgICAgIDxhcHAtaW5wdXQgdHlwZT0iZW1haWwiIG5h bWU9InNoYWRvdy1lbWFpbCIgcGxhY2Vob2xkZXI9InNoYWRvdyBlbWFpbCI+PC9hcHAtaW5wdXQ+ IDxiciAvPgogICAgICA8YXBwLWlucHV0IHR5cGU9InBhc3N3b3JkIiBuYW1lPSJzaGFkb3ctcGFz c3dvcmQiIHBsYWNlaG9sZGVyPSJzaGFkb3cgcGFzc3dvcmQiPjwvYXBwLWlucHV0PiA8YnIgLz4K ICAgIDwvZm9ybT4KICAgIAogICAgPGZvcm0+CiAgICAgIDxoMT5XZWIgQ29tcG9uZW50ICsgTGln aHQgRE9NPC9oMT4KICAgICAgPGFwcC1pbnB1dC1saWdodCB0eXBlPSJlbWFpbCIgbmFtZT0ibGln aHQtZW1haWwiIHBsYWNlaG9sZGVyPSJsaWdodCBlbWFpbCI+PC9hcHAtaW5wdXQtbGlnaHQ+CiAg ICAgIDxhcHAtaW5wdXQtbGlnaHQgdHlwZT0icGFzc3dvcmQiIG5hbWU9ImxpZ2h0LXBhc3N3b3Jk IiBwbGFjZWhvbGRlcj0ibGlnaHQgcGFzc3dvcmQiPjwvYXBwLWlucHV0LWxpZ2h0PgogICAgPC9m b3JtPgogICAgICAgIAogICAgPHNjcmlwdD4KICAgICAgY2xhc3MgQXBwSW5wdXQgZXh0ZW5kcyBI VE1MRWxlbWVudCB7CiAgICAgICAgY29uc3RydWN0b3IoKSB7CiAgICAgICAgICBzdXBlcigpOwog ICAgICAgICAgCiAgICAgICAgICBjb25zdCByb290ID0gdGhpcy5hdHRhY2hTaGFkb3coeyBtb2Rl OiAnb3BlbicgfSk7CiAgICAgICAgICBjb25zdCBnZXRUeXBlID0gKCkgPT4gewogICAgICAgICAg ICByZXR1cm4gdGhpcy5nZXRBdHRyaWJ1dGUoJ3R5cGUnKTsKICAgICAgICAgIH0KICAgICAgICAg IGNvbnN0IGdldFBsYWNlaG9sZGVyID0gKCkgPT4gewogICAgICAgICAgICByZXR1cm4gdGhpcy5n ZXRBdHRyaWJ1dGUoJ3BsYWNlaG9sZGVyJyk7CiAgICAgICAgICB9CiAgICAgICAgICBjb25zdCBn ZXROYW1lID0gKCkgPT4gewogICAgICAgICAgICByZXR1cm4gdGhpcy5nZXRBdHRyaWJ1dGUoJ25h bWUnKTsKICAgICAgICAgIH0KICAgICAgICAgIHJvb3QuaW5uZXJIVE1MID0gYAogICAgICAgICAg ICA8c3R5bGU+CiAgICAgICAgICAgICAgaW5wdXQgewogICAgICAgICAgICAgICAgZm9udC1zaXpl OiAxNnB4OwogICAgICAgICAgICAgIH0KICAgICAgICAgICAgPC9zdHlsZT4KICAgICAgICAgICAg PGlucHV0IHR5cGU9IiR7Z2V0VHlwZSgpfSIgbmFtZT0iJHtnZXROYW1lKCl9IiBwbGFjZWhvbGRl cj0iJHtnZXRQbGFjZWhvbGRlcigpfSIgLz4KICAgICAgICAgIGAKICAgICAgICB9CiAgICAgIH0K ICAgICAgCiAgICAgIHdpbmRvdy5jdXN0b21FbGVtZW50cy5kZWZpbmUoJ2FwcC1pbnB1dCcsIEFw cElucHV0KTsKICAgICAgCiAgICAgIGNsYXNzIEFwcElucHV0TGlnaHQgZXh0ZW5kcyBIVE1MRWxl bWVudCB7CiAgICAgICAgY29uc3RydWN0b3IoKSB7CiAgICAgICAgICBzdXBlcigpOwogICAgICAg ICAgCiAgICAgICAgICBjb25zdCBnZXRUeXBlID0gKCkgPT4gewogICAgICAgICAgICByZXR1cm4g dGhpcy5nZXRBdHRyaWJ1dGUoJ3R5cGUnKTsKICAgICAgICAgIH0KICAgICAgICAgIGNvbnN0IGdl dFBsYWNlaG9sZGVyID0gKCkgPT4gewogICAgICAgICAgICByZXR1cm4gdGhpcy5nZXRBdHRyaWJ1 dGUoJ3BsYWNlaG9sZGVyJyk7CiAgICAgICAgICB9CiAgICAgICAgICBjb25zdCBnZXROYW1lID0g KCkgPT4gewogICAgICAgICAgICByZXR1cm4gdGhpcy5nZXRBdHRyaWJ1dGUoJ25hbWUnKTsKICAg ICAgICAgIH0KICAgICAgICAgIHRoaXMuaW5uZXJIVE1MID0gYAogICAgICAgICAgICA8aW5wdXQg dHlwZT0iJHtnZXRUeXBlKCl9IiBuYW1lPSIke2dldE5hbWUoKX0iIHBsYWNlaG9sZGVyPSIke2dl dFBsYWNlaG9sZGVyKCl9IiAvPgogICAgICAgICAgYAogICAgICAgIH0KICAgICAgfQogICAgICAK ICAgICAgd2luZG93LmN1c3RvbUVsZW1lbnRzLmRlZmluZSgnYXBwLWlucHV0LWxpZ2h0JywgQXBw SW5wdXRMaWdodCk7CiAgICA8L3NjcmlwdD4KICA8L2JvZHk+CjwvaHRtbD4K