test for container-foo object attributes

NEW
Unassigned

Status

()

Core
Disability Access APIs
6 years ago
9 months ago

People

(Reporter: surkov, Unassigned, Mentored)

Tracking

(Blocks: 1 bug, {access})

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [good first bug][lang=js])

Attachments

(3 attachments, 2 obsolete attachments)

(Reporter)

Description

6 years ago
If you insert a text node after nested div
<div aria-live="polite" aria-atomic="false">
  <div aria-atomic="true"></div>
</div>

then container-atomic:false is on inserted node.

spun off the thread https://groups.google.com/forum/#!msg/free-aria/d03QUfMwBWc/nCidJ8ijphQJ
(Reporter)

Comment 1

6 years ago
Actually I misread the code, we should expose container-atomic:true in this case. We need a mochitest for that.

1) move aria-live and atomic object attributes tests from attributes/test_obj.html to test_obj_liveregion.html
2) add tests for container-foo object attributes
2.1) add a child text node under live region, for example,
<div aria-live="polite" aria-atomic="true"></div>
div.textContent = "hello"
2.2) use eventQueue to catch the show event (for example, refer to test_obj_css.html as example how to do that)
2.3) check container-foo object attributes on shown accessible (possible object attributes: container-relevant for aria-relevant attribute, container-live for aria-live, container-live-role for role, container-atomic for aria-atomic and container-busy for aria-busy).
3) add testing for nested aria live region attributes
Blocks: 417472
No longer blocks: 343213
Summary: container-foo object attribute should expose the closest match → test for container-foo object attributes
Whiteboard: [good first bug][mentor=surkov.alexander@gmail.com][lang=js]

Comment 2

5 years ago
Hi, this is my first try, can u gimme some more clues please
(Reporter)

Comment 3

5 years ago
(In reply to bug.c3po from comment #2)
> Hi, this is my first try, can u gimme some more clues please

comment #1 has a list of items how to fix the bug. It'd be good to start from items that aren't clear enough.

Comment 4

5 years ago
Is there a test_obj_liveregion.html file or will I create it?
(In reply to Georgiana from comment #4)
> Is there a test_obj_liveregion.html file or will I create it?

You'll need to create it. It is probably easiest to copy test_obj and remove the non live region stuff.
(Assignee)

Updated

4 years ago
Mentor: surkov.alexander@gmail.com
Whiteboard: [good first bug][mentor=surkov.alexander@gmail.com][lang=js] → [good first bug][lang=js]

Comment 6

3 years ago
Hi, I would like patch this bug. This is my first bug so assist me through.

Comment 7

a year ago
Hello, looks like this issue has received no attention in a few years. I would like to crack at this bug.
(In reply to David Bolter [:davidb] from comment #5)
> (In reply to Georgiana from comment #4)
> > Is there a test_obj_liveregion.html file or will I create it?
> 
> You'll need to create it. It is probably easiest to copy test_obj and remove
> the non live region stuff.

Hello. I'm interested in picking this bug up. I would like to know what you mean by the "non live stuff" because all seems to live to me, as far as I can tell. I have already edited my test_obj_liveregion.html file to reflect what you had suggested. Any pointers in the right direction would be helpful.
Flags: needinfo?(dbolter)
If you follow comment 1 that would be enough. Are you ready to post a patch for review?
[I will needinfo the mentor for this bug]
Flags: needinfo?(dbolter) → needinfo?(surkov.alexander)
Not yet. Unfortunately I do not yet understand how the code works. From a read through of the code, I don't know what is "non live" i.e. what code should be left out of the test_obj.html file and what should be carried over to the test_obj_liveregion.html file.
Created attachment 8853953 [details]
sample text_obj_liveregion.html file

I've made a sample text_obj_liveregion.html based on the comments I've seen here. Please let me know what I should add or remove.
Attachment #8853953 - Flags: review?(surkov.alexander)
Created attachment 8853982 [details]
Sample test_obj_liveregion.html file

Kindly review this for me and do say what I should add and/or remove. I'm not sure if I'm heading in the right direction. Thanks.
Attachment #8853953 - Attachment is obsolete: true
Attachment #8853953 - Flags: review?(surkov.alexander)
Attachment #8853982 - Flags: review?(surkov.alexander)
(Reporter)

Comment 13

9 months ago
Comment on attachment 8853982 [details]
Sample test_obj_liveregion.html file

Sorry the request slept off my radar. Would you please generate a patch and send it for review? It's that simple as running hg diff, see https://developer.mozilla.org/en-US/docs/Mercurial/Using_Mercurial#How_can_I_diff_and_patch_files.3F for details.
Flags: needinfo?(surkov.alexander)
Attachment #8853982 - Flags: review?(surkov.alexander)
Created attachment 8861471 [details] [diff] [review]
test for container-foo object attributes

Sample test_obj_liveregion.html file
Comment on attachment 8861471 [details] [diff] [review]
test for container-foo object attributes

Here's the generated patch. I hope this is the correct way of submitting the patch. If MozReview is preferred, I'll use that next time.
Flags: needinfo?(surkov.alexander)
Attachment #8861471 - Flags: review?(surkov.alexander)
(Reporter)

Comment 16

9 months ago
Comment on attachment 8861471 [details] [diff] [review]
test for container-foo object attributes

Review of attachment 8861471 [details] [diff] [review]:
-----------------------------------------------------------------

please follow comment #1, also make sure that you move ARIA live and atomic related tests only (you don't have to copy the whole test file).
Attachment #8861471 - Flags: review?(surkov.alexander)
Created attachment 8862407 [details] [diff] [review]
test for container-foo object attributes

Sample test_obj_liveregion.html
I'm not sure about how to go about doing the following:
2.2) use eventQueue to catch the show event (for example, refer to test_obj_css.html as example how to do that)
I'm guessing I should take the code of the function removeElm and then modify to catch the show event. Not sure what the show event is in this scenario.
2.3) check container-foo object attributes on shown accessible (possible object attributes: container-relevant for aria-relevant attribute, container-live for aria-live, container-live-role for role, container-atomic for aria-atomic and container-busy for aria-busy).
Do I add these attributes to both the divs and the testAttrs functions?
3) add testing for nested aria live region attributes
I think I've done this, together with moving the aria and atomic object attributes and respective tests to the test_obj_liveregion.html file
Attachment #8861471 - Attachment is obsolete: true
Comment on attachment 8862407 [details] [diff] [review]
test for container-foo object attributes

># HG changeset patch
># User Leni Kadali <lenikmutungi@gmail.com>
># Date 1493297064 -10800
>#      Thu Apr 27 15:44:24 2017 +0300
># Node ID f2eb16dfe0772f0ab454ace88baca0a8e2bb3d91
># Parent  c30bbd6f9e8dee98368a333bbc9bc4fcef438640
>Bug 788080 - test for container-foo object attributes
>Sample test_obj_liveregion.html
>I'm not sure about how to go about doing the following:
>2.2) use eventQueue to catch the show event (for example, refer to test_obj_css.html as example how to do that)
>I'm guessing I should take the code of the function removeElm and then modify to catch the show event. Not sure what the show event is in this scenario.
>2.3) check container-foo object attributes on shown accessible (possible object attributes: container-relevant for aria-relevant attribute, container-live for aria-live, container-live-role for role, container-atomic for aria-atomic and container-busy for aria-busy).
>Do I add these attributes to both the divs and the testAttrs functions?
>3) add testing for nested aria live region attributes
>I think I've done this, together with moving the aria and atomic object attributes and respective tests to the test_obj_liveregion.html file
>
>diff --git a/accessible/tests/mochitest/attributes/test_obj_liveregion.html b/accessible/tests/mochitest/attributes/test_obj_liveregion.html
>--- a/accessible/tests/mochitest/attributes/test_obj_liveregion.html
>+++ b/accessible/tests/mochitest/attributes/test_obj_liveregion.html
>@@ -26,35 +26,8 @@ https://bugzilla.mozilla.org/show_bug.cg
>       testAbsentAttrs("atomic_false", {"atomic" : "false", "container-atomic" : "false"});
>       testAbsentAttrs(getNode("atomic_false").firstChild, {"container-atomic" : "false"});
>       
>-      testAttrs("autocomplete", {"autocomplete" : "true"}, true);
>-      testAttrs("checkbox", {"checkable" : "true"}, true);
>-      testAttrs("checkedCheckbox", {"checkable" : "true"}, true);
>-      testAttrs("checkedMenuitem", {"checkable" : "true"}, true);
>-      testAttrs("checkedOption", {"checkable" : "true"}, true);
>-      testAttrs("checkedRadio", {"checkable" : "true"}, true);
>-      testAttrs("checkedTreeitem", {"checkable" : "true"}, true);
>-      testAttrs("dropeffect", {"dropeffect" : "copy"}, true);
>-      testAttrs("grabbed", {"grabbed" : "true"}, true);
>-      testAbsentAttrs("haspopup", { "haspopup": "false" });
>-      testAttrs("hidden", {"hidden" : "true"}, true);
>-      testAbsentAttrs("hidden_false", { "hidden": "false" });
>-      testAbsentAttrs("modal", {"modal" : "true"});
>-      testAttrs("sortAscending", {"sort" : "ascending"}, true);
>-      testAttrs("sortDescending", {"sort" : "descending"}, true);
>-      testAttrs("sortNone", {"sort" : "none"}, true);
>-      testAttrs("sortOther", {"sort" : "other"}, true);
>-      testAttrs("roledescr", {"roledescription" : "spreadshit"}, true);
>-      testAttrs("currentPage", {"current" : "page"}, true);
>-
>-      // inherited attributes by subdocuments
>-      var subdoc = getAccessible("iframe").firstChild;
>-      testAttrs(subdoc, {"busy" : "true"}, true);
>-
>       // live object attribute
> 
>-      // HTML
>-      testAttrs("output", {"live" : "polite"}, true);
>-
>       // ARIA
>       testAttrs("live", {"live" : "polite"}, true);
>       testAttrs("live2", {"live" : "polite"}, true);
>@@ -90,29 +63,15 @@ https://bugzilla.mozilla.org/show_bug.cg
>       testAttrs("timerChild", {"container-live-role" : "timer"}, true);
>       testAbsentAttrs("tablistChild", {"container-live-role" : "tablist"});
> 
>-      // text input type
>-      testAbsentAttrs("button", { "text-input-type": "button"});
>-      testAbsentAttrs("checkbox", { "text-input-type": "checkbox"});
>-      testAbsentAttrs("radio", { "text-input-type": "radio"});
>-      testAttrs("email", {"text-input-type" : "email"}, true);
>-      testAttrs("search", {"text-input-type" : "search"}, true);
>-      testAttrs("tel", {"text-input-type" : "tel"}, true);
>-      testAttrs("url", {"text-input-type" : "url"}, true);
>-
>+      //container-foo object attribute
>+      testAttrs("live", {"live" : "polite"}, true);
>+      testAttrs("atomic", {"atomic" : "true"}, true);
>+      div.textContent = hello;
>+      
>       // ARIA
>       testAttrs("searchbox", {"text-input-type" : "search"}, true);
> 
>-      // html
>-      testAttrs("radio", {"checkable" : "true"}, true); 
>-      testAttrs("checkbox", {"checkable" : "true"}, true); 
>-      testAttrs("draggable", {"draggable" : "true"}, true);
>-      testAttrs("th1", { "abbr": "SS#" }, true);
>-      testAttrs("th2", { "abbr": "SS#" }, true);
>-      testAttrs("th2", { "axis": "social" }, true);
>-
>-      // don't barf on an empty abbr element.
>-      testAbsentAttrs("th3", { "abbr": "" }, true);
>-
>+  
>       // application accessible
>       if (WIN) {
>         var gfxInfo = Components.classes["@mozilla.org/gfx/info;1"].
>@@ -125,9 +84,6 @@ https://bugzilla.mozilla.org/show_bug.cg
>       // no object attributes
>       testAbsentAttrs(getAccessible("listitem").firstChild, { "tag": "" });
> 
>-      // experimental aria
>-      testAttrs("experimental", {"blah" : "true"}, true);
>-      
>       gQueue = new eventQueue();
>       gQueue.push(new removeElm("div"));
>       gQueue.invoke();
>@@ -193,33 +149,7 @@ https://bugzilla.mozilla.org/show_bug.cg
>   <!-- aria -->
>   <div id="atomic" aria-atomic="true">live region</div>
>   <div id="atomic_false" aria-atomic="false">live region</div>
>-  <div id="autocomplete" role="textbox" aria-autocomplete="true"></div>
>-  <div id="checkbox" role="checkbox"></div>
>-  <div id="checkedCheckbox" role="checkbox" aria-checked="true"></div>
>-  <div id="checkedMenuitem" role="menuitem" aria-checked="true"></div>
>-  <div id="checkedOption" role="option" aria-checked="true"></div>
>-  <div id="checkedRadio" role="radio" aria-checked="true"></div>
>-  <div id="checkedTreeitem" role="treeitem" aria-checked="true"></div>
>-  <div id="dropeffect" aria-dropeffect="copy"></div>
>-  <div id="grabbed" aria-grabbed="true"></div>
>-  <div id="haspopup" aria-haspopup="true"></div>
>-  <div id="hidden" aria-hidden="true"></div>
>-  <div id="hidden_false" aria-hidden="false"></div>
>-  <div id="modal" aria-modal="true"></div>
>-  <div id="sortAscending" role="columnheader" aria-sort="ascending"></div>
>-  <div id="sortDescending" role="columnheader" aria-sort="descending"></div>
>-  <div id="sortNone" role="columnheader" aria-sort="none"></div>
>-  <div id="sortOther" role="columnheader" aria-sort="other"></div>
>-  <div id="roledescr" aria-roledescription="spreadshit"></div>
>-  <div id="currentPage" aria-current="page"></div>
>-
>-  <!-- inherited from iframe -->
>-  <iframe id="iframe" src="data:text/html,<html><body></body></html>"
>-          aria-busy="true"></iframe>
>-
>-  <!-- html -->
>-  <output id="output"></output>
>-
>+  
>   <!-- back to aria -->
>   <div id="live" aria-live="polite">excuse <div id="liveChild">me</div></div>
>   <div id="live2" role="marquee" aria-live="polite">excuse <div id="live2Child">me</div></div>
>@@ -230,41 +160,12 @@ https://bugzilla.mozilla.org/show_bug.cg
>   <div id="status" role="status">excuse <div id="statusChild">me</div></div>
>   <div id="tablist" role="tablist">tablist <div id="tablistChild">tab</div></div>
>   <div id="timer" role="timer">excuse <div id="timerChild">me</div></div>
>-  <div aria-live="polite" aria-atomic="true">
>-    div.textContent = "hello"
>+  <div id="live" aria-live="polite" aria-atomic="true">live region</div>
> 
>-    </div>
>   <!-- unusual live case -->
>   <div id="liveGroup" role="group" aria-live="polite">
>     excuse <div id="liveGroupChild">me</div>
>   </div>
>-  
>-
>-  <!-- text input type -->
>-  <input id="button" type="button"/>
>-  <input id="email" type="email"/>
>-  <input id="search" type="search"/>
>-  <input id="tel" type="tel"/>
>-  <input id="url" type="url"/>
>-  <div id="searchbox" role="searchbox"></div>
>-
>-  <!-- html -->
>-  <input id="radio" type="radio"/>
>-  <input id="checkbox" type="checkbox"/>
>-  <div id="draggable" draggable="true">Draggable div</div>
>-  <table>
>-    <tr>
>-      <th id="th1"><abbr title="Social Security Number">SS#</abbr></th>
>-      <th id="th2" abbr="SS#" axis="social">Social Security Number</th>
>-      <th id="th3"><abbr></abbr></th>
>-    </tr>
>-  </table>
>-
>-  <ul>
>-    <li id="listitem">item
>-  </ul>
>-
>-  <!-- experimental aria -->
>-  <div id="experimental" aria-blah="true">Fake beer</div>
>+ 
> </body>
> </html>
Attachment #8862407 - Attachment filename: . → test_obj_liveregion.html
Flags: needinfo?(surkov.alexander)
Attachment #8862407 - Flags: review?(surkov.alexander)
(Reporter)

Comment 19

9 months ago
Comment on attachment 8862407 [details] [diff] [review]
test for container-foo object attributes

Review of attachment 8862407 [details] [diff] [review]:
-----------------------------------------------------------------

you need to change a11y.ini too for a new file, and please remove whitespaces
Attachment #8862407 - Flags: review?(surkov.alexander)
(Reporter)

Comment 20

9 months ago
(In reply to Leni Kadali from comment #17)

> Do I add these attributes to both the divs and the testAttrs functions?
> 3) add testing for nested aria live region attributes
> I think I've done this, together with moving the aria and atomic object
> attributes and respective tests to the test_obj_liveregion.html file

for EventQueue stuff, did you check out this example https://dxr.mozilla.org/mozilla-central/source/accessible/tests/mochitest/attributes/test_obj_css.html
(In reply to alexander :surkov from comment #19)
> Comment on attachment 8862407 [details] [diff] [review]
> test for container-foo object attributes
> 
> Review of attachment 8862407 [details] [diff] [review]:
> -----------------------------------------------------------------
> 
> you need to change a11y.ini too for a new file, and please remove whitespaces

Will remove the whitespaces. What do you mean by changing a11y.ini for a new file? Are you referring to adding the new test to a11y.ini or that I should create another file?
Flags: needinfo?(surkov.alexander)
(In reply to Leni Kadali from comment #21)
> (In reply to alexander :surkov from comment #19)
> > Comment on attachment 8862407 [details] [diff] [review]
> > test for container-foo object attributes
> > 
> > Review of attachment 8862407 [details] [diff] [review]:
> > -----------------------------------------------------------------
> > 
> > you need to change a11y.ini too for a new file, and please remove whitespaces
> 
> Will remove the whitespaces. What do you mean by changing a11y.ini for a new
> file? Are you referring to adding the new test to a11y.ini or that I should
> create another file?

Understood what you meant by changing a11y.ini for a new file. Will do.
Flags: needinfo?(surkov.alexander)
Created attachment 8864504 [details] [diff] [review]
test for container-foo object attributes

Removed whitespaces.
Added the test to the a11y.ini file.
Added function removeElm and modified it for the test.
Running the test `./mach mochitest accessible/tests/mochitest/attributes/test_obj_liveregion.html` fails with the error:
56 INFO TEST-UNEXPECTED-FAIL | chrome://mochitests/content/a11y/accessible/tests/mochitest/attributes/test_obj_liveregion.html | Can't get DOM element for div
I think there is a problem with how I'm adding `div.textContent = hello` but I don't know what exactly it is.
Attachment #8864504 - Flags: review?(surkov.alexander)

Comment 24

9 months ago
Comment on attachment 8864504 [details] [diff] [review]
test for container-foo object attributes

I'm taking this at Surkov's request.

>+<div aria-live="polite" aria-atomic="true">div.textContent = hello</div>

Nope, you cannot mix HTML and JavaScript like that. What is this supposed to do anyway?

Likewise, trying to reference it from the code abofe with the string "div" will never work. You have several div elements in there. You need to give this an ID as all the others. And then you should really see what you are trying to do with that JS snippet inside the markup.
Attachment #8864504 - Flags: review?(surkov.alexander)
(In reply to Marco Zehe (:MarcoZ) from comment #24)
> Comment on attachment 8864504 [details] [diff] [review]
> test for container-foo object attributes
> 
> I'm taking this at Surkov's request.
> 
> >+<div aria-live="polite" aria-atomic="true">div.textContent = hello</div>
> 
> Nope, you cannot mix HTML and JavaScript like that. What is this supposed to
> do anyway?

According to comment 1, Surkov said that one of the things to do in terms of making the test was to 
2) add tests for container-foo object attributes
2.1) add a child text node under live region, for example,
<div aria-live="polite" aria-atomic="true"></div>
div.textContent = "hello"
So that is what I'm trying to implement. Pointers in the right direction would be appreciated. 

> Likewise, trying to reference it from the code abofe with the string "div"
> will never work. You have several div elements in there. You need to give
> this an ID as all the others. And then you should really see what you are
> trying to do with that JS snippet inside the markup.
This should have been obvious to me. My bad. :(
Flags: needinfo?(mzehe)

Comment 26

9 months ago
(In reply to Leni Kadali from comment #25)
> According to comment 1, Surkov said that one of the things to do in terms of
> making the test was to 
> 2) add tests for container-foo object attributes
> 2.1) add a child text node under live region, for example,
> <div aria-live="polite" aria-atomic="true"></div>
> div.textContent = "hello"
> So that is what I'm trying to implement. Pointers in the right direction
> would be appreciated. 

I think the second line is meant for an invoker, not in the actual HTML at the bottom. So give this div an ID like all the others, and then in an invoker where you want to check this one's container-live attributes, in the invoke function, add a child node.
Flags: needinfo?(mzehe)
You need to log in before you can comment on or make changes to this bug.