browsh-org / browsh

A fully-modern text-based browser, rendering to TTY and browsers
https://www.brow.sh
GNU Lesser General Public License v2.1
17.08k stars 417 forks source link

Some elements of a webform, like select's dropdowns, scrollbars are hardly accessible #370

Open beeduino opened 3 years ago

beeduino commented 3 years ago

I am trying to test browsh for simple form processings. I was able to open for example a form at https://final-form.org/docs/react-final-form/examples/simple Browsh opens it with very similar layout and javascript is working. Nice. Though, I was not able to get next elements working correctly:

I run this form then from a local machine, trimmed it down to remove extra styling, even added pure html elements. No improvements reached on the points above. The forms I need to work with are my own, so any tweaks are possible.
Is it possible to get form's elements more accessible with browsh?

Ubuntu 20.10 is here, gnome-terminal.

tombh commented 3 years ago

Here's a screenshot of that link you gave. I thought at first the problem was that Browsh wasn't capturing the form elements, but that doesn't seem to be the case. So my first thought is that this is more to do with the mouse? Just the fact that there's no way for the native Firefox page to receive the proxied input from the Browsh client?

image

beeduino commented 3 years ago

Thank you for the reply, @tombh . I will prepare the simplified form as I've got it almost readable and update here.

beeduino commented 3 years ago

The simplified version of the form is here: https://codesandbox.io/s/condescending-fog-0iqc3 For better view I would:

My final result in browsh (with some text filled and some elements checked) is below.

react_form_in_browsh

The least accessible elements are:

Navigation was better working with mouse. I was not able to navigate with keyboard. What could be done to improve it further? Thanks.