Opened 10 years ago

Closed 9 years ago

#10445 closed defect (wontfix)

Tab Container's ContentPane not read by JAWS

Reported by: ontak Owned by: Becky Gibson
Priority: high Milestone: tbd
Component: Accessibility Version: 1.3.1
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

Hi,

I am trying to upgrade to the newer versions of Dojo Toolkit, so I am doing some JAWS regression testing with newer version of Dojo Toolkit against my sample code, and found that the ContentPane text is not being read by JAWS. !Currently, I am using Dojo Toolkit 1.1.1 with my code and JAWS was able to tab-focus into the ContentPane and read the text. But with the newer versions of Dojo Toolkit 1.3.1, and 1.4.0 b2 (the two versions that I tested), when the tab-focus is on the ContentPane? which doesn't have the selected="true", those ConentPane are NOT read by JAWS. (In my sample code [below], that would mean "The Three Green Twigs" is the only tab's ContentPane able to be read by JAWS, and the other two were not)

Can someone tell me if JAWS has been tested with the newer versions of Dojo Toolkit? If so, is there some code that I need to add in my sample for the newer version for JAWS to read the to other ContentPane text.

Thanks.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
		"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>TabContainer Demo</title>

	<style type="text/css">
		@import "dojo/resources/dojo.css";
		@import "dijit/themes/soria/soria.css";
	</style>
	
	<!-- required: dojo.js -->
	<script type="text/javascript" src="dojo/dojo.js"
		djConfig="isDebug: false, parseOnLoad: true"></script>

	<script type="text/javascript">
		dojo.require("dijit.dijit"); // optimize: load dijit layer
		dojo.require("dijit.layout.ContentPane");
		dojo.require("dijit.layout.TabContainer");
		dojo.require("dojo.parser");	// scan page for widgets and instantiate them		
	</script>
</head>

	
	

<body class="soria">
   
<P>1] Tab Container (click on the tab to see content)</p>
<div id="tabContainer" dojoType="dijit.layout.TabContainer" 
        style="width:35em;height:10em" >  
      <div id="LittleRed" dojoType="dijit.layout.ContentPane" title="Little Red Cap" tabindex="0">
      Little Red Cap:  Once upon a time there was a dear little girl who was loved by 
      every one who looked at her, but most of all by her grandmother, 
      and there was nothing that she would not have given to the child. 
      </div>	 
      <div id="HanselGretel" dojoType="dijit.layout.ContentPane" 
           title="Hansel and Gretel"   tabindex="0">
      Hansel and Gretel:  Hard by a great forest dwelt a poor wood-cutter with his wife 
      and his two children. The boy was called Hansel and the girl Gretel. 
      He had little to bite and to break, and once when great dearth fell 
      on the land, he could no longer procure even daily bread.
      </div>
      <div id="GreenTwigs" dojoType="dijit.layout.ContentPane" 
             title="The Three Green Twigs" selected="true" tabindex="0">
      The Three Green Twigs:  There was once upon a time a hermit who lived in a forest at the foot 
      of a mountain, and passed his time in prayer and good works, 
      and every evening he carried, to the glory of God, two pails of water 
      up the mountain. 
      </div>
</div>
</body></html>

Attachments (1)

tab header.GIF (7.5 KB) - added by ontak 10 years ago.

Download all attachments as: .zip

Change History (8)

comment:1 Changed 10 years ago by ontak

Hi,

Quick update, I just test with JAWS Virtual PC-mode off (insert-z) and this time, all the tab's ContentPane? text was able to be read, but the tab's text (title) were not read by JAWS. Can you provide more insight?

Thanks.

comment:2 Changed 10 years ago by bill

Description: modified (diff)

Thanks for the testing and the test case. BTW, please attach test cases using the attach file button.

JAWS has been tested extensively. Which browser/OS are you trying?

There is a known issue that IE won't focus on a <div> without a tabIndex, even if it has a scrollbar, so there's no way for keyboard users to scroll such <div>'s, but that sounds unrelated.

comment:3 Changed 10 years ago by Becky Gibson

Yes, it is important to know what browser and version as well as what version of JAWS you are using. We have been testing the 1.4 dijit widgets with Firefox 3.5.5 and JAWS 11.

Changed 10 years ago by ontak

Attachment: tab header.GIF added

comment:4 Changed 10 years ago by ontak

It was explained to me by an accessibility expert at my company on the correct JAWS usage, and here is the failing test case as explained by him which I have documented and now posting.


JAWS 10 and IE 6 with Dojo Toolkit 1.3.1 and 1.4.0b2

Test case:

1) Turn JAWS 10 on 2) Bring focus to one of the tab "header" in the tab container using the keyboard-tab key. JAWS will read the text on that selected tab "header" (see screenshot of the tab "header") 3) Enter JAWS form-mode by hitting the keyboard-enter key. 4) Navigate to the other tab "header" using the keyboard left/right arrow key.

At this point, JAWS will fail to read any of the text on the tab "header".

Previous, with the same JAWS 10 and IE 6 and Dojo Toolkit 1.1.1, this test case passed. Please advise further.

comment:5 Changed 10 years ago by Becky Gibson

The dijits use WAI-ARIA to provide screen reader accessibility. This is explained further in the accessibility statement: http://docs.dojocampus.org/dijit-a11y-statement. We use Firefox for testing and have never tested the dijits with IE6 and JAWS as many of them will not work. We only support screen reader use of the dijits in Firefox and IE 8.

I don't know why the tab container used to work as we only focus on IE 6 for keyboard support. I did update the tab container to use more of the WAI-ARIA properties, that may account for the differences you are seeing.

comment:6 Changed 10 years ago by bill

Sounds like a wontfix then Becky?

comment:7 Changed 9 years ago by Becky Gibson

Resolution: wontfix
Status: newclosed

Yes, marking as a wontfix as the problem is IE 6. As an FYI - if you want the contents of a contentPane spoken when that pane is made visible you can mark it a an aria-live region. The mail demo does this for the preview pane:

<!-- message preview pane -->

<div id="message" dojoType="dijit.layout.ContentPane?" tabindex="0" region="center" role="document" aria-live="assertive" aria-atomic="true" minSize="20">

Although ARIA live regions only started being supported in JAWS 10 and FF3.5+

Note: See TracTickets for help on using tickets.