formkit icon indicating copy to clipboard operation
formkit copied to clipboard

1.0.0-beta9: Radio buttons have no effect on Safari 12.0

Open totalhack opened this issue 3 years ago • 6 comments

Reproduction

https://github.com/totalhack/formkit-multistep

Describe the bug

This was briefly discussed in https://github.com/formkit/formkit/issues/299 but opening this since I'm still seeing the issue with beta9.

On Safari 12.0 the radio buttons seem to have no effect. Clicking them changes the UI to appear selected but the underlying model shows no change in selection. This does not happen with recent versions of Chrome or Firefox using the same project and there are no console errors. In previous testing I saw this with some earlier versions of Chrome and Edge as well, but I need to retry that to get you specifics.

Note: The original reproduction saw it with this starter project when I was using beta8, but since updating that to beta9 it is seeing a different style issue preventing radio buttons from appearing (https://github.com/formkit/formkit/issues/304), so this reproduction uses the formkit-multistep repo that uses tailwind.

Environment

• OS: Mac OS • Browser: Safari, possibly others • Version: 12.0

totalhack avatar Jun 30 '22 01:06 totalhack

I can only get access to 12.1 via browser stack and in that version all is well with beta.9 — (no styling issues either using the original start project swapped out with beta.9). When I go back to 11.1 I can see what I presume is what you're describing where I can select different radios but the value of the model doesn't update. However, the styling was fine in 11.1 too.

I wonder if there was some change between 12 and 12.1 that fixed whatever it is you're seeing. Maybe you can take a quick screen capture of the effects your noticing to make sure we're solving for the right issue.

justin-schroeder avatar Jun 30 '22 02:06 justin-schroeder

Here is a screen capture showing the formkit-multistep project in Safari 12.0 with beta.9. It's quite possible something changed from 12.0 to 12.1. I plan to get back into browserstack today to see if I can find this issue on non-Safari browsers, pretty sure I saw it in Chrome 61-ish.

https://user-images.githubusercontent.com/43683140/176688813-c66f3583-3356-42d2-87bb-53a9c5319178.mov

totalhack avatar Jun 30 '22 13:06 totalhack

Perfect — we're tracking the same issue then. I am able to see the same behavior on safari <= 11.1, but I dont have access to 12.0, and 12.1 it appears to be "fixed". I presume tackling this with browser stack at on Safari 11.1 will suffice to solve it for 12.0 too then.

justin-schroeder avatar Jun 30 '22 14:06 justin-schroeder

Minor update: 12.1 works for me in browserstack too (using a tailwind-based project) but I see this issue still locally on 12.0, and in browserstack on Chrome <= 65.

totalhack avatar Jun 30 '22 15:06 totalhack

I was looking at the usage numbers for these browsers. 12.0 has a 0.00% market, in fact all browser usage of any version of safari < 12.1 is 0.08% share according to can i use.

All versions of Chrome <= 65 has a 0.54% market share. I'm not saying this is nothing, but in context we're talking about a cumulative browser share that is less than ie 11 (0.84%) which we officially don’t support.

Still, my curriosity has the best of me and i'd love to track this down a but further.

justin-schroeder avatar Jul 02 '22 14:07 justin-schroeder

My aim to get these browsers working is based on me using the module/nomodule approach. I actually load a different form library altogether for the nomodule group (which includes IE 11). These browsers happen to be in the "module" group where FormKit loads so that's why I ended up testing them at all (and I happen to still have Safari 12.0 on a laptop).

I would totally get if you felt like this wasn't a priority though. Some points to consider:

  1. The browser usage stats will vary across different cohorts. Some applications may be naturally targeted to geos/demos that are more impacted by this.
  2. Some of your competitors, such as JotForm, support older browsers.
  3. I don't know how deep the rabbit hole is as I haven't tried all of your input types, but for my particular use case the radio button is currently the only one not working. So you might be close to supporting these browsers (with JS/CSS polyfills as I am using)

If I were you I would de-prioritize this as well though given where you are in the launch of FormKit.

totalhack avatar Jul 03 '22 15:07 totalhack

Appreciate the efforts on this one. We've decided to officially drop support for Safari 12.0, although 12.1 should still work fine.

justin-schroeder avatar Jan 12 '23 18:01 justin-schroeder