summaryrefslogtreecommitdiffstats
path: root/accessible/tests/mochitest/elm/test_HTMLSpec.html
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--accessible/tests/mochitest/elm/test_HTMLSpec.html2024
1 files changed, 2024 insertions, 0 deletions
diff --git a/accessible/tests/mochitest/elm/test_HTMLSpec.html b/accessible/tests/mochitest/elm/test_HTMLSpec.html
new file mode 100644
index 0000000000..a5cc175123
--- /dev/null
+++ b/accessible/tests/mochitest/elm/test_HTMLSpec.html
@@ -0,0 +1,2024 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>HTML a11y spec tests</title>
+ <link id="link" rel="stylesheet" type="text/css"
+ href="chrome://mochikit/content/tests/SimpleTest/test.css" />
+
+ <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+
+ <script type="application/javascript"
+ src="../common.js"></script>
+ <script type="application/javascript"
+ src="../actions.js"></script>
+ <script type="application/javascript"
+ src="../role.js"></script>
+ <script type="application/javascript"
+ src="../states.js"></script>
+ <script type="application/javascript"
+ src="../attributes.js"></script>
+ <script type="application/javascript"
+ src="../relations.js"></script>
+ <script type="application/javascript"
+ src="../name.js"></script>
+
+ <script type="application/javascript">
+ const syntheticBrowsingContexts = SpecialPowers.getBoolPref("browser.opaqueResponseBlocking.syntheticBrowsingContext", false);
+
+ async function doTest() {
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:a@href
+
+ var obj = {
+ role: ROLE_LINK,
+ states: STATE_LINKED,
+ actions: "jump",
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText, nsIAccessibleHyperLink ],
+ children: [ // all kids inherits linked state and action
+ {
+ role: ROLE_TEXT_LEAF,
+ states: STATE_LINKED,
+ actions: "click ancestor",
+ },
+ ],
+ };
+ testElm("a_href", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:a no @href
+
+ obj = {
+ todo_role: ROLE_TEXT_CONTAINER,
+ absentStates: STATE_LINKED,
+ actions: null,
+ children: [
+ {
+ role: ROLE_TEXT_LEAF,
+ absentStates: STATE_LINKED,
+ actions: null,
+ },
+ ],
+ };
+ testElm("a_nohref", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:abbr contained by HTML:td
+
+ obj = {
+ role: ROLE_CELL,
+ attributes: { abbr: "WWW" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [
+ {
+ role: ROLE_TEXT,
+ children: [ { role: ROLE_TEXT_LEAF } ],
+ },
+ ],
+ };
+ testElm("td_abbr", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:address
+
+ obj = {
+ role: ROLE_GROUPING,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("address", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:area@href
+
+ obj = {
+ role: ROLE_LINK,
+ states: STATE_LINKED,
+ actions: "jump",
+ interfaces: [ nsIAccessibleHyperLink ],
+ children: [],
+ };
+ testElm(getAccessible("imgmap").firstChild, obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:area no @href
+
+ obj = {
+ todo_role: "ROLE_SHAPE",
+ absentStates: STATE_LINKED,
+ children: [],
+ };
+ testElm(getAccessible("imgmap").lastChild, obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:article
+ obj = {
+ role: ROLE_ARTICLE,
+ states: STATE_READONLY,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("article", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:aside
+ obj = {
+ role: ROLE_LANDMARK,
+ attributes: { "xml-roles": "complementary" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("aside", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ obj = { // HTML:audio
+ role: ROLE_GROUPING,
+ };
+ testElm("audio", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ obj = { // HTML:b contained by paragraph
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-weight": kBoldFontWeight },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:b text
+ ],
+ };
+ testElm("b_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ obj = { // HTML:bdi contained by paragraph
+ role: ROLE_PARAGRAPH,
+ todo_textAttrs: {
+ 0: { },
+ 5: { "writing-mode": "rl" },
+ 8: { },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:bdi text
+ { role: ROLE_TEXT_LEAF }, // plain text
+ ],
+ };
+ testElm("bdi_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:bdo contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ todo_textAttrs: {
+ 0: { },
+ 6: { "writing-mode": "rl" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ ],
+ };
+ testElm("bdo_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:blockquote
+
+ obj = {
+ role: ROLE_BLOCKQUOTE,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [ { role: ROLE_PARAGRAPH } ],
+ };
+ testElm("blockquote", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:br contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_WHITESPACE },
+ { role: ROLE_WHITESPACE }
+ ]
+ };
+ testElm("br_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ obj = { // HTML:button
+ role: ROLE_PUSHBUTTON,
+ absentStates: STATE_DEFAULT,
+ actions: "press",
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("button", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:button@type="submit" (default button)
+
+ obj = {
+ role: ROLE_PUSHBUTTON,
+ states: STATE_DEFAULT,
+ actions: "press",
+ };
+ testElm("button_default", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:canvas
+
+ obj = {
+ role: ROLE_CANVAS,
+ };
+ testElm("canvas", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:caption under table
+
+ obj = {
+ role: ROLE_TABLE,
+ relations: {
+ RELATION_LABELLED_BY: "caption",
+ },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText, nsIAccessibleTable ],
+ children: [
+ {
+ role: ROLE_CAPTION,
+ relations: {
+ RELATION_LABEL_FOR: "table",
+ },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ { // td inside thead
+ role: ROLE_ROW,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [
+ {
+ role: ROLE_COLUMNHEADER,
+ interfaces: [ nsIAccessibleTableCell, nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ { role: ROLE_COLUMNHEADER },
+ ],
+ },
+ { // td inside tbody
+ role: ROLE_ROW,
+ children: [
+ {
+ role: ROLE_ROWHEADER,
+ interfaces: [ nsIAccessibleTableCell, nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ {
+ role: ROLE_CELL,
+ interfaces: [ nsIAccessibleTableCell, nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ ],
+ },
+ { // td inside tfoot
+ role: ROLE_ROW,
+ },
+ ],
+ };
+ testElm("table", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:cite contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-style": "italic" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:cite text
+ ],
+ };
+ testElm("cite_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:code contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-family": kMonospaceFontFamily },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:code text
+ ],
+ };
+ testElm("code_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:col and HTML:colgroup under table
+
+ obj =
+ { TABLE: [
+ { ROW: [
+ { role: ROLE_CELL },
+ { role: ROLE_CELL },
+ { role: ROLE_CELL },
+ ] },
+ ] };
+ testElm("colNcolgroup_table", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:data contained by paragraph
+
+ obj =
+ { PARAGRAPH: [
+ { TEXT_LEAF: [] }, // HTML:data text
+ ] };
+ testElm("data_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:datalist associated with input
+
+ todo(false, "datalist and summary tree hierarchy test missed");
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:dd, HTML:dl, HTML:dd
+
+ obj = {
+ role: ROLE_DEFINITION_LIST,
+ states: STATE_READONLY,
+ children: [ // dl
+ {
+ role: ROLE_TERM,
+ states: STATE_READONLY,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [ // dt
+ { role: ROLE_TEXT_LEAF },
+ ],
+ },
+ {
+ role: ROLE_DEFINITION,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [ // dd
+ { role: ROLE_TEXT_LEAF },
+ ],
+ },
+ ],
+ };
+ testElm("dl", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:del contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_CONTENT_DELETION },
+ ],
+ };
+ testElm("del_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:details with open state
+
+ obj = {
+ role: ROLE_DETAILS,
+ children: [
+ {
+ role: ROLE_SUMMARY,
+ states: STATE_EXPANDED,
+ actions: "collapse",
+ },
+ { role: ROLE_PARAGRAPH },
+ ],
+ };
+ testElm("details", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:details with closed (default) state
+
+ obj = {
+ role: ROLE_DETAILS,
+ children: [
+ {
+ role: ROLE_SUMMARY,
+ states: STATE_COLLAPSED,
+ actions: "expand",
+ },
+ ],
+ };
+ testElm("details_closed", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:dfn contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { "font-style": "italic" },
+ 12: { },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // HTML:dfn text
+ { role: ROLE_TEXT_LEAF }, // plain text
+ ],
+ };
+ testElm("dfn_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:dialog
+
+ // XXX: Remove the pushing of the pref and just run the test once the
+ // dialog element is enabled by default.
+ await SpecialPowers.pushPrefEnv({ set: [["dom.dialog_element.enabled", true]] });
+ obj = {
+ role: ROLE_DIALOG,
+ children: [
+ { role: ROLE_TEXT_LEAF },
+ ],
+ };
+ testElm("dialog", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:div
+
+ obj = {
+ role: ROLE_SECTION,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ ],
+ };
+ testElm("div", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:em in a paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-style": "italic" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:em text
+ ],
+ };
+ testElm("em_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:embed
+
+ if (syntheticBrowsingContexts) {
+ obj = {
+ INTERNAL_FRAME: [ {
+ DOCUMENT: [ {
+ role: ROLE_GRAPHIC,
+ interfaces: [ nsIAccessibleImage ],
+ } ],
+ } ],
+ };
+ } else {
+ obj = {
+ role: ROLE_GRAPHIC,
+ interfaces: [ nsIAccessibleImage ],
+ };
+ }
+ testElm("embed_png", obj);
+
+ obj = {
+ INTERNAL_FRAME: [ {
+ DOCUMENT: [ {
+ role: ROLE_PARAGRAPH,
+ } ],
+ } ],
+ };
+ testElm("embed_html", obj);
+
+ obj = {
+ INTERNAL_FRAME: [ {
+ DOCUMENT: [ {
+ } ],
+ } ],
+ };
+ testElm("embed_pdf", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:fieldset and HTML:legend
+
+ obj = {
+ role: ROLE_GROUPING,
+ name: "legend",
+ relations: {
+ RELATION_LABELLED_BY: "legend",
+ },
+ children: [
+ {
+ role: ROLE_LABEL,
+ name: "legend",
+ relations: {
+ RELATION_LABEL_FOR: "fieldset",
+ },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ {
+ role: ROLE_ENTRY,
+ },
+ ],
+ };
+ testElm("fieldset", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:figure and HTML:figcaption
+
+ obj = {
+ role: ROLE_FIGURE,
+ attributes: { "xml-roles": "figure" },
+ relations: {
+ RELATION_LABELLED_BY: "figcaption",
+ },
+ children: [
+ { role: ROLE_GRAPHIC },
+ {
+ role: ROLE_CAPTION,
+ relations: {
+ RELATION_LABEL_FOR: "figure",
+ },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ ],
+ };
+ testElm("figure", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:footer
+
+ obj = {
+ role: ROLE_LANDMARK,
+ attributes: { "xml-roles": "contentinfo" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("footer", obj);
+
+ obj = {
+ role: ROLE_SECTION,
+ absentAttributes: { "xml-roles": "contentinfo" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("footer_in_article", obj);
+ testElm("footer_in_aside", obj);
+ testElm("footer_in_main", obj);
+ testElm("footer_in_nav", obj);
+ testElm("footer_in_section", obj);
+ testElm("footer_in_blockquote", obj);
+ testElm("footer_in_details", obj);
+ testElm("footer_in_dialog", obj);
+ testElm("footer_in_fieldset", obj);
+ testElm("footer_in_figure", obj);
+ testElm("footer_in_td", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:form
+
+ obj = {
+ role: ROLE_FORM,
+ absentAttributes: { "xml-roles": "form" },
+ };
+ testElm("form", obj);
+
+ // HTML:form with an accessible name
+
+ obj = {
+ role: ROLE_FORM_LANDMARK,
+ attributes: { "xml-roles": "form" },
+ };
+ testElm("named_form", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // // HTML:frameset, HTML:frame and HTML:iframe
+
+ obj = {
+ INTERNAL_FRAME: [ { // HTML:iframe
+ DOCUMENT: [ {
+ INTERNAL_FRAME: [ { // HTML:frame
+ DOCUMENT: [ { role: ROLE_TEXT_LEAF} ],
+ } ],
+ } ],
+ } ],
+ };
+ testElm("frameset_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:h1, HTML:h2, HTML:h3, HTML:h4, HTML:h5, HTML:h6
+
+ function headingWithLevel(i) {
+ return {
+ role: ROLE_HEADING,
+ attributes: { "level": i.toString() },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ }
+
+ for (let level = 1; level <= 6; ++level) {
+ testElm("h" + level, headingWithLevel(level));
+ for (const ancestor of ["section", "article", "aside", "nav"]) {
+ testElm("h" + level + "_in_" + ancestor, headingWithLevel(level));
+ testElm("h" + level + "_in_" + ancestor + "_in_hgroup", headingWithLevel(level));
+ }
+ }
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:header
+
+ obj = {
+ role: ROLE_LANDMARK,
+ attributes: { "xml-roles": "banner" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("header", obj);
+
+ obj = {
+ role: ROLE_SECTION,
+ absentAttributes: { "xml-roles": "banner" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("header_in_article", obj);
+ testElm("header_in_aside", obj);
+ testElm("header_in_main", obj);
+ testElm("header_in_nav", obj);
+ testElm("header_in_section", obj);
+ testElm("header_in_blockquote", obj);
+ testElm("header_in_details", obj);
+ testElm("header_in_dialog", obj);
+ testElm("header_in_fieldset", obj);
+ testElm("header_in_figure", obj);
+ testElm("header_in_td", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:hr
+
+ obj = {
+ role: ROLE_SEPARATOR,
+ };
+ testElm("hr", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ obj = { // HTML:i contained by paragraph
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-style": "italic" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:i text
+ ],
+ };
+ testElm("i_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:img
+
+ obj = {
+ role: ROLE_GRAPHIC,
+ interfaces: [ nsIAccessibleImage ],
+ };
+ testElm("img", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="button"
+
+ obj = {
+ role: ROLE_PUSHBUTTON,
+ absentStates: STATE_DEFAULT,
+ };
+ testElm("input_button", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="checkbox"
+
+ obj = {
+ role: ROLE_CHECKBUTTON,
+ states: STATE_CHECKABLE,
+ absentStates: STATE_CHECKED,
+ actions: "check",
+ };
+ testElm("input_checkbox", obj);
+
+ obj = {
+ role: ROLE_CHECKBUTTON,
+ states: STATE_CHECKABLE | STATE_CHECKED,
+ actions: "uncheck",
+ };
+ testElm("input_checkbox_true", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="file"
+
+ obj = {
+ GROUPING: [
+ { role: ROLE_PUSHBUTTON },
+ { role: ROLE_LABEL },
+ ],
+ };
+ testElm("input_file", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="image"
+
+ obj = {
+ role: ROLE_PUSHBUTTON,
+ absentStates: STATE_DEFAULT,
+ actions: "press",
+ };
+ testElm("input_image", obj);
+ testElm("input_image_display", obj);
+ testElm("input_submit", obj);
+
+ obj = {
+ role: ROLE_PUSHBUTTON,
+ actions: "press",
+ states: STATE_DEFAULT,
+ };
+ testElm("input_image_default", obj);
+ testElm("input_submit_default", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="number" and etc
+
+ obj = {
+ role: ROLE_SPINBUTTON,
+ interfaces: [ nsIAccessibleValue, nsIAccessibleText, nsIAccessibleEditableText ],
+ children: [
+ { role: ROLE_TEXT_LEAF },
+ ],
+ };
+ testElm("input_number", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="text" and etc
+
+ obj = {
+ role: ROLE_ENTRY,
+ extraStates: EXT_STATE_EDITABLE | EXT_STATE_SINGLE_LINE,
+ actions: "activate",
+ interfaces: [ nsIAccessibleText, nsIAccessibleEditableText ],
+ children: [
+ { role: ROLE_TEXT_LEAF },
+ ],
+ };
+ testElm("input_email", obj);
+ testElm("input_search", obj);
+ testElm("input_tel", obj);
+ testElm("input_text", obj);
+ testElm("input_url", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // input @type="text" with placeholder attribute
+
+ // First: Label and placeholder, text is the same, no attribute.
+ obj = {
+ role: ROLE_ENTRY,
+ name: "Your name",
+ extraStates: EXT_STATE_EDITABLE | EXT_STATE_SINGLE_LINE,
+ actions: "activate",
+ absentAttributes: { placeholder: "Your name" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleEditableText ],
+ children: [],
+ };
+ testElm("input_placeholder_same", obj);
+
+ // Second: Label and placeholder, text is different, attribute.
+ obj = {
+ role: ROLE_ENTRY,
+ name: "First name:",
+ extraStates: EXT_STATE_EDITABLE | EXT_STATE_SINGLE_LINE,
+ actions: "activate",
+ attributes: { placeholder: "Enter your first name" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleEditableText ],
+ children: [],
+ };
+ testElm("input_placeholder_different", obj);
+
+ // Third: placeholder only, text is name, no attribute.
+ obj = {
+ role: ROLE_ENTRY,
+ name: "Date of birth",
+ extraStates: EXT_STATE_EDITABLE | EXT_STATE_SINGLE_LINE,
+ actions: "activate",
+ absentAttributes: { placeholder: "Date of birth" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleEditableText ],
+ children: [],
+ };
+ testElm("input_placeholder_only", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="password"
+
+ obj = {
+ role: ROLE_PASSWORD_TEXT,
+ states: STATE_PROTECTED,
+ extraStates: EXT_STATE_EDITABLE,
+ actions: "activate",
+ children: [
+ {
+ role: ROLE_TEXT_LEAF,
+ },
+ ],
+ };
+ testElm("input_password", obj);
+ ok(getAccessible("input_password").firstChild.name != "44",
+ "text leaf for password shouldn't have its real value as its name!");
+
+ obj = {
+ role: ROLE_PASSWORD_TEXT,
+ states: STATE_PROTECTED | STATE_READONLY,
+ actions: "activate",
+ children: [
+ {
+ role: ROLE_TEXT_LEAF,
+ },
+ ],
+ };
+ testElm("input_password_readonly", obj);
+ ok(getAccessible("input_password_readonly").firstChild.name != "44",
+ "text leaf for password shouldn't have its real value as its name!");
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="radio"
+
+ obj = {
+ role: ROLE_RADIOBUTTON,
+ states: STATE_CHECKABLE,
+ absentStates: STATE_CHECKED,
+ actions: "select",
+ };
+ testElm("input_radio", obj);
+
+ obj = {
+ role: ROLE_RADIOBUTTON,
+ states: STATE_CHECKABLE | STATE_CHECKED,
+ actions: "select",
+ };
+ testElm("input_radio_true", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="range"
+
+ obj = {
+ role: ROLE_SLIDER,
+ };
+ testElm("input_range", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="reset"
+
+ obj = {
+ role: ROLE_PUSHBUTTON,
+ actions: "press",
+ absentStates: STATE_DEFAULT,
+ };
+ testElm("input_reset", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="time"
+
+ obj = {
+ role: ROLE_TIME_EDITOR,
+ name: "time label",
+ attributes: { "text-input-type": "time" },
+ children: [
+ { role: ROLE_SPINBUTTON },
+ { role: ROLE_TEXT_LEAF },
+ { role: ROLE_SPINBUTTON },
+ { role: ROLE_TEXT_LEAF },
+ { role: ROLE_ENTRY },
+ ],
+ };
+ testElm("input_time", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="date"
+
+ obj = {
+ role: ROLE_DATE_EDITOR,
+ name: "date label",
+ attributes: { "text-input-type": "date" },
+ children: [
+ { role: ROLE_SPINBUTTON },
+ { role: ROLE_TEXT_LEAF },
+ { role: ROLE_SPINBUTTON },
+ { role: ROLE_TEXT_LEAF },
+ { role: ROLE_SPINBUTTON },
+ { role: ROLE_PUSHBUTTON },
+ ],
+ };
+ testElm("input_date", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:input@type="datetime-local"
+
+ obj = {
+ role: ROLE_DATE_EDITOR,
+ name: "datetime-local label",
+ attributes: { "text-input-type": "datetime-local" },
+ children: [
+ { role: ROLE_SPINBUTTON }, // Month
+ { role: ROLE_TEXT_LEAF }, // "/""
+ { role: ROLE_SPINBUTTON }, // Day
+ { role: ROLE_TEXT_LEAF }, // "/"
+ { role: ROLE_SPINBUTTON }, // Year
+ { role: ROLE_TEXT_LEAF }, // " "
+ { role: ROLE_SPINBUTTON }, // Hours
+ { role: ROLE_TEXT_LEAF }, // ":"
+ { role: ROLE_SPINBUTTON }, // Minutes
+ { role: ROLE_TEXT_LEAF }, // " "
+ { role: ROLE_ENTRY }, // "AM" or "PM"
+ { role: ROLE_PUSHBUTTON }, // Calendar
+ ],
+ };
+ testElm("input_datetime_local", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:ins contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_CONTENT_INSERTION },
+ ],
+ };
+ testElm("ins_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:kbd contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-family": kMonospaceFontFamily },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:kbd text
+ ],
+ };
+ testElm("kbd_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:label
+
+ obj = {
+ role: ROLE_LABEL,
+ todo_relations: {
+ RELATION_LABEL_FOR: "label_input",
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ {
+ role: ROLE_ENTRY,
+ relations: {
+ RELATION_LABELLED_BY: "label",
+ },
+ },
+ ],
+ };
+ testElm("label", obj);
+
+ obj = {
+ role: ROLE_LABEL,
+ relations: {
+ RELATION_LABEL_FOR: "label_for_input",
+ },
+ };
+ testElm("label_for", obj);
+
+ obj = {
+ role: ROLE_ENTRY,
+ relations: {
+ RELATION_LABELLED_BY: "label_for",
+ },
+ };
+ testElm("label_for_input", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:ul, HTML:ol, HTML:li
+
+ obj = { // ul or ol
+ role: ROLE_LIST,
+ states: STATE_READONLY,
+ children: [
+ { // li
+ role: ROLE_LISTITEM,
+ states: STATE_READONLY,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ ],
+ };
+ testElm("ul", obj);
+ testElm("ol", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:link
+
+ ok(!isAccessible("link"), "link element is not accessible");
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:main
+
+ obj = {
+ role: ROLE_LANDMARK,
+ attributes: { "xml-roles": "main" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("main", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:map
+
+ ok(!isAccessible("map_imagemap"),
+ "map element is not accessible if used as an image map");
+
+ obj = {
+ role: ROLE_TEXT_CONTAINER,
+ };
+ testElm("map", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:mark contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_MARK, // HTML:mark text
+ attributes: { "xml-roles": "mark" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ textAttrs: {
+ 0: { },
+ }
+ }
+ ],
+ };
+ testElm("mark_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:math
+
+ obj = {
+ role: ROLE_MATHML_MATH,
+ };
+ testElm("math", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:menu
+
+ obj = {
+ role: ROLE_LIST, // menu
+ children: [
+ { role: ROLE_LISTITEM,
+ children: [ // home
+ { role: ROLE_LISTITEM_MARKER },
+ { role: ROLE_TEXT_LEAF }
+ ]
+ },
+ {
+ role: ROLE_LISTITEM,
+ children: [
+ { role: ROLE_LISTITEM_MARKER },
+ { role: ROLE_TEXT_LEAF }, // about
+ {
+ role: ROLE_LIST, // menu
+ children: [
+ { role: ROLE_LISTITEM,
+ children: [
+ { role: ROLE_LISTITEM_MARKER },
+ { role: ROLE_TEXT_LEAF } // our story
+ ]
+ },
+ ]
+ },
+ ]
+ },
+ ]
+ };
+
+ testElm("menu", obj);
+ obj = {
+ role: ROLE_LIST,
+ children: [
+ {
+ role: ROLE_LISTITEM,
+ children: [
+ { role: ROLE_LISTITEM_MARKER },
+ {
+ role: ROLE_PUSHBUTTON,
+ children: [
+ { role: ROLE_TEXT_LEAF }
+ ]
+ },
+ {
+ role: ROLE_LIST,
+ children: [
+ {
+ role: ROLE_LISTITEM,
+ children: [
+ { role: ROLE_LISTITEM_MARKER },
+ {
+ role: ROLE_PUSHBUTTON,
+ children: [
+ { role: ROLE_TEXT_LEAF }
+ ]
+ }
+ ]
+ },
+ ]
+ }
+ ]
+ }
+ ]
+ };
+ testElm("menu1", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:meter
+ obj = {
+ role: ROLE_METER
+ };
+ testElm("meter", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:nav
+
+ obj = {
+ role: ROLE_LANDMARK,
+ attributes: { "xml-roles": "navigation" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("nav", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:object and HTML:param
+
+ if (syntheticBrowsingContexts) {
+ obj = {
+ INTERNAL_FRAME: [ {
+ DOCUMENT: [ {
+ role: ROLE_GRAPHIC,
+ interfaces: [ nsIAccessibleImage ],
+ } ],
+ } ],
+ };
+ } else {
+ obj = {
+ role: ROLE_GRAPHIC,
+ interfaces: [ nsIAccessibleImage ],
+ };
+ }
+ testElm("object_png", obj);
+
+ obj = {
+ INTERNAL_FRAME: [ {
+ DOCUMENT: [ {
+ role: ROLE_PARAGRAPH,
+ } ],
+ } ],
+ };
+ testElm("object_html", obj);
+
+ obj = {
+ INTERNAL_FRAME: [ {
+ DOCUMENT: [ {
+ } ],
+ } ],
+ };
+ testElm("object_pdf", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:select, HTML:optgroup and HTML:option
+
+ obj = { // HMTL:select@size > 1
+ role: ROLE_LISTBOX,
+ states: STATE_FOCUSABLE,
+ absentStates: STATE_MULTISELECTABLE,
+ interfaces: [ nsIAccessibleSelectable ],
+ children: [
+ { GROUPING: [ // HTML:optgroup
+ { role: ROLE_STATICTEXT },
+ { role: ROLE_OPTION }, // HTML:option
+ { role: ROLE_OPTION },
+ ] },
+ {
+ role: ROLE_OPTION,
+ states: STATE_FOCUSABLE,
+ actions: "select",
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ },
+ ],
+ };
+ testElm("select_listbox", obj);
+
+ obj = { // HTML:select@multiple
+ role: ROLE_LISTBOX,
+ states: STATE_FOCUSABLE | STATE_MULTISELECTABLE,
+ children: [
+ { role: ROLE_OPTION },
+ { role: ROLE_OPTION },
+ { role: ROLE_OPTION },
+ ],
+ };
+ testElm("select_listbox_multiselectable", obj);
+
+ obj = { // HTML:select
+ role: ROLE_COMBOBOX,
+ states: STATE_FOCUSABLE,
+ children: [
+ {
+ role: ROLE_COMBOBOX_LIST,
+ children: [
+ { role: ROLE_COMBOBOX_OPTION },
+ { role: ROLE_COMBOBOX_OPTION },
+ { role: ROLE_COMBOBOX_OPTION },
+ ],
+ },
+ ],
+ };
+ testElm("select_combobox", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:output
+
+ obj = {
+ role: ROLE_STATUSBAR,
+ attributes: { "live": "polite" },
+ todo_relations: {
+ RELATION_CONTROLLED_BY: "output_input",
+ },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("output", obj);
+
+ obj = {
+ role: ROLE_ENTRY,
+ relations: {
+ RELATION_CONTROLLER_FOR: "output",
+ },
+ };
+ testElm("output_input", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:pre
+
+ obj = {
+ role: ROLE_TEXT_CONTAINER,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("pre", obj);
+
+ // /////////////////////////////////////////////////////////////////////////
+ // HTML:progress
+
+ obj = {
+ role: ROLE_PROGRESSBAR,
+ absentStates: STATE_MIXED,
+ interfaces: [ nsIAccessibleValue ],
+ };
+ testElm("progress", obj);
+
+ obj = {
+ role: ROLE_PROGRESSBAR,
+ states: STATE_MIXED,
+ };
+ testElm("progress_indeterminate", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:q
+
+ obj = {
+ role: ROLE_TEXT,
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ children: [
+ { role: ROLE_STATICTEXT }, // left quote
+ { role: ROLE_TEXT_LEAF }, // quoted text
+ { role: ROLE_STATICTEXT }, // right quote
+ ],
+ };
+ testElm("q", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:ruby
+
+ todo(isAccessible("ruby"), "ruby element is not accessible");
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:s contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "text-line-through-style": "solid" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:i text
+ ],
+ };
+ testElm("s_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:samp contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:samp text
+ ],
+ };
+ testElm("samp_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:section without an accessible name
+
+ obj = {
+ role: ROLE_SECTION,
+ absentAttributes: { "xml-roles": "region" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("section", obj);
+
+ // HTML:section with an accessible name
+
+ obj = {
+ role: ROLE_REGION,
+ attributes: { "xml-roles": "region" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("named_section", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:small contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "font-size": "10pt" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:small text
+ ],
+ };
+ testElm("small_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:source
+
+ ok(!isAccessible("source"), "source element is not accessible");
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:span
+
+ ok(!isAccessible("span"), "span element is not accessible");
+
+ // ////////////////////////////////////////////////////////////////////////
+ // html:span with a title attribute, which should make it accessible.
+ obj = {
+ role: ROLE_TEXT,
+ };
+ testElm("span_explicit", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:strong contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:strong text
+ ],
+ };
+ testElm("strong_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:sub
+ obj = {
+ role: ROLE_SUBSCRIPT
+ };
+ testElm("sub", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:sup
+ obj = {
+ role: ROLE_SUPERSCRIPT
+ };
+ testElm("sup", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:sub contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ {
+ role: ROLE_SUBSCRIPT, // HTML:sub
+ children: [
+ { role: ROLE_TEXT_LEAF } // HTML:sub text
+ ]
+ }
+ ],
+ };
+ testElm("sub_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:sup contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ {
+ role: ROLE_SUPERSCRIPT, // HTML:sup
+ children: [
+ { role: ROLE_TEXT_LEAF } // HTML:sup text
+ ]
+ }
+ ],
+ };
+ testElm("sup_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:svg
+
+ obj = {
+ todo_role: ROLE_GRAPHIC,
+ };
+ testElm("svg", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:textarea
+
+ obj = {
+ role: ROLE_ENTRY,
+ extraStates: EXT_STATE_MULTI_LINE | EXT_STATE_EDITABLE,
+ actions: "activate",
+ interfaces: [ nsIAccessibleText, nsIAccessibleEditableText ],
+ };
+ testElm("textarea", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:time
+
+ obj = {
+ role: ROLE_TEXT,
+ attributes: { "xml-roles": "time", "datetime": "2001-05-15 19:00" },
+ interfaces: [ nsIAccessibleText, nsIAccessibleHyperText ],
+ };
+ testElm("time", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:u contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ textAttrs: {
+ 0: { },
+ 6: { "text-underline-style": "solid" },
+ },
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:u text
+ ],
+ };
+ testElm("u_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ // HTML:var contained by paragraph
+
+ obj = {
+ role: ROLE_PARAGRAPH,
+ children: [
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:var text
+ { role: ROLE_TEXT_LEAF }, // plain text
+ { role: ROLE_TEXT_LEAF }, // HTML:var text
+ ],
+ };
+ testElm("var_container", obj);
+
+ // ////////////////////////////////////////////////////////////////////////
+ obj = { // HTML:video
+ role: ROLE_GROUPING,
+ };
+ testElm("video", obj);
+
+ SimpleTest.finish();
+ }
+
+ SimpleTest.waitForExplicitFinish();
+ addA11yLoadEvent(doTest);
+
+ </script>
+</head>
+<body>
+
+ <a target="_blank"
+ title="Implement figure and figcaption accessibility"
+ href="https://bugzilla.mozilla.org/show_bug.cgi?id=658272">
+ Mozilla Bug 658272
+ </a><br/>
+ <p id="display"></p>
+ <div id="content" style="display: none"></div>
+ <pre id="test">
+ </pre>
+
+ <a id="a_href" href="www.mozilla.com">mozilla site</a>
+ <a id="a_nohref">anchor</a>
+ <table>
+ <tr>
+ <td id="td_abbr"><abbr title="World Wide Web">WWW</abbr></td>
+ </tr>
+ </table>
+ <address id="address">
+ Mozilla Foundation<br>
+ 1981 Landings Drive<br>
+ Building K<br>
+ Mountain View, CA 94043-0801<br>
+ USA
+ </address>
+
+ <map name="atoz_map">
+ <area id="area_href"
+ href="http://www.bbc.co.uk/radio4/atoz/index.shtml#b"
+ coords="17,0,30,14" alt="b" shape="rect">
+ <area id="area_nohref"
+ coords="0,0,13,14" alt="a" shape="rect">
+ </map>
+ <img id="imgmap" width="447" height="15"
+ usemap="#atoz_map"
+ src="../letters.gif">
+
+ <article id="article">A document</article>
+ <audio id="audio" controls="true">
+ <source id="source" src="../bug461281.ogg" type="video/ogg">
+ </audio>
+
+ <aside id="aside">
+ <p>Some content related to an &lt;article&gt;</p>
+ </aside>
+
+ <p id="b_container">normal<b>bold</b></p>
+ <p id="bdi_container">User <bdi>إيان</bdi>: 90 points</p>
+ <p id="bdo_container"><bdo dir="rtl">This text will go right to left.</bdo></p>
+
+ <blockquote id="blockquote" cite="http://developer.mozilla.org">
+ <p>This is a quotation taken from the Mozilla Developer Center.</p>
+ </blockquote>
+
+ <!-- two BRs, both will be present -->
+ <p id="br_container"><br><br></p>
+
+ <button id="button">button</button>
+ <form>
+ <button id="button_default" type="submit">button</button>
+ </form>
+
+ <canvas id="canvas"></canvas>
+
+ <table id="table">
+ <caption id="caption">caption</caption>
+ <thead>
+ <tr>
+ <th>col1</th><th>col2</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <th>col1</th><td>cell2</td>
+ </tr>
+ </tbody>
+ <tfoot>
+ <tr>
+ <td>cell5</td><td>cell6</td>
+ </tr>
+ </tfoot>
+ </table>
+
+ <p id="cite_container">normal<cite>cite</cite></p>
+ <p id="code_container">normal<code>code</code></p>
+
+ <table id="colNcolgroup_table">
+ <colgroup>
+ <col>
+ <col span="2">
+ </colgroup>
+ <tr>
+ <td>Lime</td>
+ <td>Lemon</td>
+ <td>Orange</td>
+ </tr>
+ </table>
+
+ <p id="data_container"><data value="8">Eight</data></p>
+
+ <datalist id="datalist">
+ <summary id="summary">details</summary>
+ <option>Paris</option>
+ <option>San Francisco</option>
+ </datalist>
+ <input id="autocomplete_datalist" list="datalist">
+
+ <dl id="dl">
+ <dt>item1</dt><dd>description</dd>
+ </dl>
+
+ <p id="del_container">normal<del>Removed</del></p>
+
+ <details id="details" open="open">
+ <summary>Information</summary>
+ <p>If your browser supports this element, it should allow you to expand and collapse these details.</p>
+ </details>
+
+ <details id="details_closed">
+ <summary>Information</summary>
+ <p>If your browser supports this element, it should allow you to expand and collapse these details.</p>
+ </details>
+
+ <p id="dfn_container"><dfn id="def-internet">The Internet</dfn> is a global
+ system of interconnected networks that use the Internet Protocol Suite (TCP/IP)
+ to serve billions of users worldwide.</p>
+
+ <dialog id="dialog" open="true">This is a dialog</dialog>
+
+ <div id="div">div</div>
+
+ <p id="em_container">normal<em>emphasis</em></p>
+
+ <embed id="embed_png" type="image/png" src="../moz.png"
+ width="300" height="300">
+ </embed>
+ <embed id="embed_html" type="text/html" src="../longdesc_src.html"
+ width="300" height="300">
+ </embed>
+ <embed id="embed_pdf" type="application/pdf" src="../dummy.pdf"
+ width="300" height="300">
+ </embed>
+
+ <fieldset id="fieldset">
+ <legend id="legend">legend</legend>
+ <input />
+ </fieldset>
+
+ <!-- Depending on whether or not the image is cached, layout may be able to
+ optimize away spaces between the figure, img and figcaption tags. As
+ such, we should keep everything on one line to get consistent results.
+ -->
+ <figure id="figure"><img src="../moz.png" alt="An awesome picture"><figcaption id="figcaption">Caption for the awesome picture</figcaption></figure>
+
+ <footer id="footer">Some copyright info</footer>
+ <article>
+ <footer id="footer_in_article">Some copyright info</footer>
+ </article>
+ <aside>
+ <footer id="footer_in_aside">Some copyright info</footer>
+ </aside>
+ <main>
+ <footer id="footer_in_main">Some copyright info</footer>
+ </main>
+ <nav>
+ <footer id="footer_in_nav">Some copyright info</footer>
+ </nav>
+ <section>
+ <footer id="footer_in_section">Some copyright info</footer>
+ </section>
+ <blockquote>
+ <footer id="footer_in_blockquote">Some copyright info</footer>
+ </blockquote>
+ <details open="true">
+ <footer id="footer_in_details">Some copyright info</footer>
+ </details>
+ <dialog open="true">
+ <footer id="footer_in_dialog">Some copyright info</footer>
+ </dialog>
+ <fieldset>
+ <footer id="footer_in_fieldset">Some copyright info</footer>
+ </fieldset>
+ <figure>
+ <footer id="footer_in_figure">Some copyright info</footer>
+ </figure>
+ <table><tr><td>
+ <footer id="footer_in_td">Some copyright info</footer>
+ </td></tr></table>
+
+ <form id="form"></form>
+ <form id="named_form" aria-label="New form"></form>
+
+ <iframe id="frameset_container"
+ src="data:text/html,<html><frameset><frame src='data:text/html,hi'></frame></frameset></html>">
+ </iframe>
+
+ <h1 id="h1">heading1</h1>
+ <h2 id="h2">heading2</h2>
+ <h3 id="h3">heading3</h3>
+ <h4 id="h4">heading4</h4>
+ <h5 id="h5">heading5</h5>
+ <h6 id="h6">heading6</h6>
+
+ <header id="header">A logo</header>
+ <article>
+ <header id="header_in_article">Not logo</header>
+ <h1 id="h1_in_article">heading1</h1>
+ <h2 id="h2_in_article">heading2</h2>
+ <h3 id="h3_in_article">heading3</h3>
+ <h4 id="h4_in_article">heading4</h4>
+ <h5 id="h5_in_article">heading5</h5>
+ <h6 id="h6_in_article">heading6</h6>
+ <hgroup>
+ <h1 id="h1_in_article_in_hgroup">heading1</h1>
+ <h2 id="h2_in_article_in_hgroup">heading2</h2>
+ <h3 id="h3_in_article_in_hgroup">heading3</h3>
+ <h4 id="h4_in_article_in_hgroup">heading4</h4>
+ <h5 id="h5_in_article_in_hgroup">heading5</h5>
+ <h6 id="h6_in_article_in_hgroup">heading6</h6>
+ </hgroup>
+ </article>
+ <aside>
+ <header id="header_in_aside">Not logo</header>
+ <h1 id="h1_in_aside">heading1</h1>
+ <h2 id="h2_in_aside">heading2</h2>
+ <h3 id="h3_in_aside">heading3</h3>
+ <h4 id="h4_in_aside">heading4</h4>
+ <h5 id="h5_in_aside">heading5</h5>
+ <h6 id="h6_in_aside">heading6</h6>
+ <hgroup>
+ <h1 id="h1_in_aside_in_hgroup">heading1</h1>
+ <h2 id="h2_in_aside_in_hgroup">heading2</h2>
+ <h3 id="h3_in_aside_in_hgroup">heading3</h3>
+ <h4 id="h4_in_aside_in_hgroup">heading4</h4>
+ <h5 id="h5_in_aside_in_hgroup">heading5</h5>
+ <h6 id="h6_in_aside_in_hgroup">heading6</h6>
+ </hgroup>
+ </aside>
+ <main>
+ <header id="header_in_main">Not logo</header>
+ </main>
+ <nav>
+ <header id="header_in_nav">Not logo</header>
+ <h1 id="h1_in_nav">heading1</h1>
+ <h2 id="h2_in_nav">heading2</h2>
+ <h3 id="h3_in_nav">heading3</h3>
+ <h4 id="h4_in_nav">heading4</h4>
+ <h5 id="h5_in_nav">heading5</h5>
+ <h6 id="h6_in_nav">heading6</h6>
+ <hgroup>
+ <h1 id="h1_in_nav_in_hgroup">heading1</h1>
+ <h2 id="h2_in_nav_in_hgroup">heading2</h2>
+ <h3 id="h3_in_nav_in_hgroup">heading3</h3>
+ <h4 id="h4_in_nav_in_hgroup">heading4</h4>
+ <h5 id="h5_in_nav_in_hgroup">heading5</h5>
+ <h6 id="h6_in_nav_in_hgroup">heading6</h6>
+ </hgroup>
+ </nav>
+ <section>
+ <header id="header_in_section">Not logo</header>
+ <h1 id="h1_in_section">heading1</h1>
+ <h2 id="h2_in_section">heading2</h2>
+ <h3 id="h3_in_section">heading3</h3>
+ <h4 id="h4_in_section">heading4</h4>
+ <h5 id="h5_in_section">heading5</h5>
+ <h6 id="h6_in_section">heading6</h6>
+ <hgroup>
+ <h1 id="h1_in_section_in_hgroup">heading1</h1>
+ <h2 id="h2_in_section_in_hgroup">heading2</h2>
+ <h3 id="h3_in_section_in_hgroup">heading3</h3>
+ <h4 id="h4_in_section_in_hgroup">heading4</h4>
+ <h5 id="h5_in_section_in_hgroup">heading5</h5>
+ <h6 id="h6_in_section_in_hgroup">heading6</h6>
+ </hgroup>
+ </section>
+ <blockquote>
+ <header id="header_in_blockquote">Not logo</header>
+ </blockquote>
+ <details open="true">
+ <header id="header_in_details">Not logo</header>
+ </details>
+ <dialog open="true">
+ <header id="header_in_dialog">Not logo</header>
+ </dialog>
+ <fieldset>
+ <header id="header_in_fieldset">Not logo</header>
+ </fieldset>
+ <figure>
+ <header id="header_in_figure">Not logo</header>
+ </figure>
+ <table><tr><td>
+ <header id="header_in_td">Not logo</header>
+ </td></tr></table>
+
+ <hr id="hr">
+ <p id="i_container">normal<i>italic</i></p>
+ <img id="img" src="../moz.png">
+
+ <input id="input_button" type="button" value="Button">
+ <input id="input_checkbox" type="checkbox">
+ <input id="input_checkbox_true" type="checkbox" checked>
+ <input id="input_file" type="file">
+ <input id="input_image" type="image">
+ <input id="input_image_display" type="image" style="display: block">
+ <form>
+ <input id="input_image_default" type="image">
+ </form>
+ <input id="input_submit" type="submit">
+ <form>
+ <input id="input_submit_default" type="submit">
+ </form>
+ <input id="input_number" type="number" value="44">
+ <input id="input_text" type="text" value="hi">
+ <form>
+ <label for="input_placeholder_same">Your name</label>
+ <input id="input_placeholder_same" placeholder="Your name"/>
+ <label for="input_placeholder_different">First name:</label>
+ <input id="input_placeholder_different" placeholder="Enter your first name"/>
+ <input id="input_placeholder_only" placeholder="Date of birth"/>
+ </form>
+ <input id="input_search" type="search" value="cats">
+ <input id="input_email" type="email" value="me@mozilla.com">
+ <input id="input_tel" type="tel" value="111.111.1111">
+ <input id="input_url" type="url" value="www.mozilla.com">
+ <input id="input_password" type="password" value="44">
+ <input id="input_password_readonly" type="password" value="44" readonly>
+ <input id="input_radio" type="radio">
+ <input id="input_radio_true" type="radio" checked>
+ <input id="input_range" type="range">
+ <form>
+ <input id="input_reset" type="reset">
+ </form>
+ <label>time label
+ <input id="input_time" type="time" value="23:23">
+ </label>
+ <label>date label
+ <input id="input_date" type="date" value="2017-11-10">
+ </label>
+ <label>datetime-local label
+ <input id="input_datetime_local" type="datetime-local" value="2017-11-10T23:23">
+ </label>
+
+ <p id="ins_container">normal<ins>Inserted</ins></p>
+ <p id="kbd_container">normal<kbd>cmd</kbd></p>
+
+ <label id="label">label<input id="label_input"></label>
+ <label id="label_for" for="label_for_input">label</label>
+ <input id="label_for_input">
+
+ <ul id="ul">
+ <li>item1</li>
+ </ul>
+ <ol id="ol">
+ <li>item1</li>
+ </ol>
+
+ <main id="main">main</main>
+
+ <map id="map_imagemap" name="atoz_map">
+ <area href="http://www.bbc.co.uk/radio4/atoz/index.shtml#b"
+ coords="17,0,30,14" alt="b" shape="rect">
+ <area href="http://www.bbc.co.uk/radio4/atoz/index.shtml#a"
+ coords="0,0,13,14" alt="a" shape="rect">
+ </map>
+ <img id="imgmap" width="447" height="15"
+ usemap="#atoz_map"
+ src="../letters.gif">
+
+ <map id="map" title="Navigation Bar" name="mapgroup">
+ <p>
+ [<a href="#how">Bypass navigation bar</a>]
+ [<a href="home.html">Home</a>]
+ </p>
+ </map>
+
+ <p id="mark_container">normal<mark>highlighted</mark></p>
+
+ <math id="math">
+ <mrow>
+ <mrow>
+ <msup>
+ <mi>a</mi>
+ <mn>2</mn>
+ </msup>
+ <mo>+</mo>
+ <msup>
+ <mi>b</mi>
+ <mn>2</mn>
+ </msup>
+ </mrow>
+ <mo>=</mo>
+ <msup>
+ <mi>c</mi>
+ <mn>2</mn>
+ </msup>
+ </mrow>
+ </math>
+
+ <menu id="menu">
+ <li>Home</li>
+ <li>About
+ <menu>
+ <li>Our Story</li>
+ </menu>
+ </li>
+ </menu>
+
+ <menu id="menu1">
+ <li>
+ <button>File</button>
+ <menu>
+ <li>
+ <button type="button" onclick="new()">New...</button>
+ </li>
+ </menu>
+ </li>
+ </menu>
+
+ <meter id="meter" min="0" max="1000" low="300" high="700" value="200">200 Euro</meter>
+
+ <nav id="nav">
+ <ul>
+ <li><a href="#">Home</a></li>
+ <li><a href="#">About</a></li>
+ <li><a href="#">Contact</a></li>
+ </ul>
+ </nav>
+
+ <object id="object_png" type="image/png" data="../moz.png"
+ width="300" height="300">
+ </object>
+ <object id="object_html" type="text/html" data="../longdesc_src.html"
+ width="300" height="300">
+ </object>
+ <object id="object_pdf" type="application/pdf" data="../dummy.pdf"
+ width="300" height="300">
+ </object>
+
+ <select id="select_listbox" size="4">
+ <optgroup label="Colors">
+ <option>Red</option>
+ <option>Blue</option>
+ </optgroup>
+ <option>Animal</option>
+ </select>
+
+ <select id="select_listbox_multiselectable" multiple>
+ <option>Red</option>
+ <option>Blue</option>
+ <option>Green</option>
+ </select>
+
+ <select id="select_combobox">
+ <option>Red</option>
+ <option>Blue</option>
+ <option>Green</option>
+ </select>
+
+ <input id="output_input">
+ <output id="output" for="output_input"></output>
+
+ <pre id="pre">pre</pre>
+
+ <progress id="progress" min="0" value="21" max="42"></progress>
+ <progress id="progress_indeterminate"></progress>
+
+ <q id="q" cite="http://en.wikipedia.org/wiki/Kenny_McCormick#Cultural_impact">
+ Oh my God, they killed Kenny!
+ </q>
+
+ <ruby id="ruby">
+ 漢 <rp>(</rp><rt>Kan</rt><rp>)</rp>
+ 字 <rp>(</rp><rt>ji</rt><rp>)</rp>
+ </ruby>
+
+ <p id="s_container">normal<s>striked</s></p>
+ <p id="samp_container">normal<samp>sample</samp></p>
+ <section id="section">section</section>
+ <section id="named_section" aria-label="foo">named section</section>
+ <p id="small_container">normal<small>small</small></p>
+ <span id="span"></span>
+ <span id="span_explicit" title="explicit"></span>
+ <p id="strong_container">normal<strong>strong</strong></p>
+ <sub id="sub"></sub>
+ <sup id="sup"></sup>
+ <p id="sub_container">normal<sub>sub</sub></p>
+ <p id="sup_container">normal<sup>sup</sup></p>
+
+ <svg id="svg"></svg>
+ <textarea id="textarea"></textarea>
+
+ <p>The concert took place on <time id="time" datetime="2001-05-15 19:00">May 15</time></p>
+ <p id="u_container">normal<u>underline</u></p>
+ <p id="var_container">An equation: <var>x</var> = <var>y</var></p>
+
+ <video id="video" controls="true">
+ <source id="source" src="../bug461281.ogg" type="video/ogg">
+ </video>
+
+</video>
+</body>
+</html>
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-17 11:59:01 +0000