After placing focus on a <legend> with JavaScript, JAWS skips past the first piece of content when continuing to read down the page

andymantell commented 2 years ago

Summary

Given the following html, if you place focus on the <legend> element with JavaScript and then press the down arrow key, it announces "Paragraph 2", seemingly skipping the "Paragraph 1" element.

https://user-images.githubusercontent.com/134642/177112463-8e838d64-4610-4562-b916-dc7e20142c17.mp4

This only occurs if it's in a fieldset. If I remove the wrapping fieldset but leave the legend in, then it will behave as I'd expect - allowing me to move from the legend down to paragraph 1.

<fieldset>
  <legend tabindex="-1">Legend</legend>
  <p>Paragraph 1</p>
  <p>Paragraph 2</p>
  <p>Paragraph 3</p>
  <p>Paragraph 4</p>
  <p>Paragraph 5</p>
  <p>Paragraph 6</p>

  <button>Move focus to the legend</button>
</fieldset>

<script>
document.querySelector('button').addEventListener('click', () => {
  document.querySelector('legend').focus();
});
</script>

Visit https://codepen.io/andymantell/pen/rNdOajK (Ideally in debug mode, to strip out all the frames)
Press the "Move focus to the legend" button
Hear that it announces the legend
Press the down arrow

Expected result

I would expect it to announce "Paragraph 1" since this is immediately after the legend

Actual result

It announces "Paragraph 2" - completely skipping over paragraph 1

Example

https://codepen.io/andymantell/pen/rNdOajK

Additional Information

JAWS version and build number

2022.2206.9

Operating System and version

Windows 10

Browser and version:

Chrome 103

JAWS-test commented 2 years ago

Can confirm the problem. Does not occur with NVDA.

andymantell commented 2 years ago

I've managed to work around the bug for the moment by using a <br> after the legend instead of using a bottom margin to achieve the visual spacing I need. That way JAWS skips the <br> instead of skipping my paragraph. It's a bit nasty but it's a better user experience.

StephenBeckettTPGi commented 2 years ago

Can confirm - in sample markup, JAWS skips first paragraph in fieldset on pressing down arrow, after focus has been moved to the (both in Chrome and Firefox). I also note that when the receives focus, JAWS does not voice the legend text as I would expect either.

FreedomScientific / standards-support