Just as the title says.
I cant find ANYTHING for this particular usecase Online.
This is in context of a website aiming to be AA WCAG 2.0 conform.
I have non-focussable text alongside focussable textinputs inside of a single view.
I can TAB through the focussable textinputs, but I cant read out the textfields inbetween. When I press "arrow down" while having the focus on the textinput I get "empty field" from NVDA. Most shortcuts also unfortunately produce text in the textinputfield instead of executing the associated behavior in NVDA.
Is there any way have the keystrokes being recognized as commands instead of input for the textfield? Is there any keyboard shortcut telling NVDA to behave like this?
Under the hood, NVDA auto switches to Forms mode, so what you're getting is the correct behaviour. if that text is related to the field, then you should use aria-describedby="[id of text]", on the form element.
I wouldn't be looking at anything that changes the default behaviour of how it works, as this will undoubtedly cause issues, for end users.
Could you not put that text in a tooltip, that is only shown when a user tabs to an interactive icon, next to the input (using the aria-describedby attribute too)?
Related
The arrow keys navigation works fine when NVDA is off, but as soon as I open NVDA in the background I can't use it to navigate in tab groups.
Did you ever experience this and do you have any suggestions on how to resolve it? Thank you.
The role is set to 'presentation', I tried changing it to tablist and it does not work. Role 'tab' alters the entire navigation behavior of the tab group so I want to avoid that as the expected behavior is to navigate with left/right arrow keys.
It would be helpful to have some code posted, otherwise we're just guessing.
When you tab to the tab navigator does the focus move to the tab that is selected within the group? (When tabbing to it the first time, I presume the first tab is selected.) Once the tab navigator has focus, then you can use the left/right arrow keys to navigate to the other tabs (when NVDA is not running)?
(It's unfortunate that pattern is called a "tab" which is confusing when also talking about the tab key)
I would first start with making sure you're following the "tab navigator" design pattern. If everything works as explained in that design pattern, in particular, the "Keyboard Interaction" section, then it sounds like you don't have the roles set on the right elements.
The behavior you're describing sounds like the left/right arrow keys are going to NVDA instead of to the tab navigator. You didn't say what happens when you press left/right when NVDA is running. Are characters read one by one? That would definitely mean the left/right arrow keyboard events are going to NVDA.
If that's true, then you don't have the role="tablist" set on the right element (and possibly role="tab" is not set on the right elements.) Confirm again you're following the design pattern.
When you have role="tablist", that will automatically switch NVDA from "browse mode" (where keyboard events are sent to NVDA) to "forms mode" (where keyboard events are sent to your application). When keyboard events are sent to your application, the left/right arrow keys should work just like when NVDA is not running.
You can see a list of roles that cause NVDA to switch modes automatically for you at "Fundamental Keyboard Navigation Conventions". The tab pattern is one of those roles.
You should be able to confirm your left/right arrow keys work by tabbing to your tab navigator with NVDA running then pressing INS+space. That will toggle the "browse mode" to "forms mode" and then your arrow keys should work.
I need to take screenshots of a web page. I want to highlight certain areas of the page before taking the screenshot. I am visually impaired, so using the mouse is out of the question.
I generally use shift and the arrow keys to select text. While this works on web pages, the text is selected, but not highlighted. IE I know it is selected, but someone who will look at the screenshot won't be able to see it.
Q: is there a way of highlighting text on a web page using the keyboard?
I am using Windows 11 with NVDA as my screen reader.
This appears to be possible with Google Chrome if the accessibility option "Navigate pages with a text cursor" is enabled—also known as "caret browsing". Here is a Google Chrome help article about it: "Use a text cursor to navigate & select text".
The article states that this setting can be toggled by pressing F7, or by opening the "Customize and control Google Chrome" menu, opening "Settings", navigating to the "Advanced" tab, then selecting "Accessibility".
This mode allows you to use the arrow keys to move the text cursor around the page, similar to if you were editing a block of text. Text can be visually highlighted by navigating to the start of the text you want to highlight, holding the Shift key, and then arrowing to the end of the text.
I'm not sure how well this will work in conjunction with NVDA though.
I have an ASPxTextBox with a NullText. It is used for a user name. Some users are copying their user name from the registration email into this text box. When they do it via right click and the context menu and go back to their email client to copy the password, the text box gets emptied, i. e. NullText is displayed.
I can reproduce this. However, when using Ctrl+V to paste the user name, it is persistent.
It seems to me that the ASPxTextBox is looking for a keydown event or something similar to decide if the text has changed.
How can I make the text persistent in all cases?
It seems that this behavior is a side effect of the browser/form AutoComplete feature.
Can you try to reproduce this issue with a regular with the placeholder attribute (HTML5)?
If the behavior is the same, see this thread.
I am working around this issue with this jquery plugin:
https://github.com/mathiasbynens/jquery-placeholder
I am creating a mobile app using FB4.6/AIR. I am running into several issues when I have TextInput fields in my view. If I have a TextField (StageText) that has text pre-populated in it (i.e. from a data object), when the view loads, the TextField will flash the text until it eventually stops and the text disappears. Upon selecting the TextField, the text will reappear. Obviously, this is not an ideal situation. So, after doing some research, I bypassed using the StageText by using the SkinClass - 'spark.skins.mobile.TextInputSkin'. This fixed the flashing text issue, however, now upon entering text in the TextField, after a certain point, the text seems to duplicate itself several times over, so that the the word, in this case an email address, becomes unrecognizable (i.e. John.Doe#MyEmail.com would become John.Doe#MyEmail.com#MyEmail.comJohn.Doe#My).
Obviously, I need to find a solution for one of these situations. Suggestions?
Thanks, in advance.
I have a custom TextInput that listens for the FocusEvent.FOCUS_IN and FocusEvent.FOCUS_OUT events:
textDisplay.addEventListener(FocusEvent.FOCUS_IN, onFocusInHandler);
textDisplay.addEventListener(FocusEvent.FOCUS_OUT, onFocusOutHandler);
My onFocusInHandler function basically removes a "promptview" that tells the user to type in a value, with the onFocusOutHandler doing the opposite.
For example, if the TextInput text was backspaced to a blank value and the user clicks out of the TextInput box, it would show a "Please enter a value" light-gray prompt in the TextInput.
This works fine until the user clicks our custom "Clear" button. The clear button sets the text to "", and I can tell the FocusEvent.FOCUS_OUT is received because the prompt text is set to visible (its not being set anywhere else). The problem is, the cursor remains in the box as if it still has focus, so if the user immediately starts typing, both the prompt text "Please enter a value" and the user-entered text appears over the gray text, which looks pretty ugly and unreadable.
Why does the TextInput receive the FocusEvent.FOCUS_OUT event if it's not actually losing focus? Is there any way I can get around this?
Option 1. Use the Spak TextInput in Flex 4.1 or 4.5. This already provides a promptDisplay by default (as mentioned in the comments)
Option 2. Take a look at the focus-skin. This skin class is usually placed on top of the normal skin. There could exist some focus ambiguity between these two. Try using a custom focus-skin without a textDisplay and clear button.
Option 3. Not only use a focus event to show or hide the prompt, but also look at the content of the TextInput. You don't want to display a prompt when the text is set by binding as wel.