browser_markup_links_01.js (4815B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Tests that links are shown in attributes when the values (or part of the 7 // values) are URIs or pointers to IDs. 8 9 const TEST_URL = URL_ROOT + "doc_markup_links.html"; 10 11 const TEST_DATA = [ 12 { 13 selector: "link", 14 attributes: [ 15 { 16 attributeName: "href", 17 links: [{ type: "cssresource", value: "style.css" }], 18 }, 19 ], 20 }, 21 { 22 selector: "link[rel=icon]", 23 attributes: [ 24 { 25 attributeName: "href", 26 links: [ 27 { 28 type: "uri", 29 value: "/media/img/firefox/favicon-196.223e1bcaf067.png", 30 }, 31 ], 32 }, 33 ], 34 }, 35 { 36 selector: "form", 37 attributes: [ 38 { 39 attributeName: "action", 40 links: [{ type: "uri", value: "/post_message" }], 41 }, 42 ], 43 }, 44 { 45 selector: "label[for=name]", 46 attributes: [ 47 { 48 attributeName: "for", 49 links: [{ type: "idref", value: "name" }], 50 }, 51 ], 52 }, 53 { 54 selector: "label[for=message]", 55 attributes: [ 56 { 57 attributeName: "for", 58 links: [{ type: "idref", value: "message" }], 59 }, 60 ], 61 }, 62 { 63 selector: `label[for="${CSS.escape("3d")}"]`, 64 attributes: [ 65 { 66 attributeName: "for", 67 links: [{ type: "idref", value: "3d" }], 68 }, 69 ], 70 }, 71 { 72 selector: "output", 73 attributes: [ 74 { 75 attributeName: "form", 76 links: [{ type: "idref", value: "message-form" }], 77 }, 78 { 79 attributeName: "for", 80 links: [ 81 { type: "idref", value: "name" }, 82 { type: "idref", value: "message" }, 83 { type: "idref", value: "invalid" }, 84 ], 85 }, 86 ], 87 }, 88 { 89 selector: "a", 90 attributes: [ 91 { 92 attributeName: "href", 93 links: [{ type: "uri", value: "/go/somewhere/else" }], 94 }, 95 { 96 attributeName: "ping", 97 links: [ 98 { type: "uri", value: "/analytics?page=pageA" }, 99 { type: "uri", value: "/analytics?user=test" }, 100 ], 101 }, 102 ], 103 }, 104 { 105 selector: "li[contextmenu=menu1]", 106 attributes: [ 107 { 108 attributeName: "contextmenu", 109 links: [{ type: "idref", value: "menu1" }], 110 }, 111 ], 112 }, 113 { 114 selector: "li[contextmenu=menu2]", 115 attributes: [ 116 { 117 attributeName: "contextmenu", 118 links: [{ type: "idref", value: "menu2" }], 119 }, 120 ], 121 }, 122 { 123 selector: "li[contextmenu=menu3]", 124 attributes: [ 125 { 126 attributeName: "contextmenu", 127 links: [{ type: "idref", value: "menu3" }], 128 }, 129 ], 130 }, 131 { 132 selector: "video", 133 attributes: [ 134 { 135 attributeName: "poster", 136 links: [{ type: "uri", value: "doc_markup_tooltip.png" }], 137 }, 138 { 139 attributeName: "src", 140 links: [{ type: "uri", value: "code-rush.mp4" }], 141 }, 142 ], 143 }, 144 { 145 selector: "script", 146 attributes: [ 147 { 148 attributeName: "src", 149 links: [{ type: "jsresource", value: "events/lib_jquery_1.0.js" }], 150 }, 151 ], 152 }, 153 { 154 selector: "#invoker", 155 attributes: [ 156 { 157 attributeName: "commandfor", 158 links: [{ type: "idref", value: "invokee" }], 159 }, 160 ], 161 }, 162 { 163 selector: "#popover-invoker", 164 attributes: [ 165 { 166 attributeName: "popovertarget", 167 links: [{ type: "idref", value: "my-popover" }], 168 }, 169 ], 170 }, 171 ]; 172 173 requestLongerTimeout(2); 174 175 add_task(async function () { 176 const { inspector } = await openInspectorForURL(TEST_URL); 177 178 for (const { selector, attributes } of TEST_DATA) { 179 info("Testing attributes on node " + selector); 180 await selectNode(selector, inspector); 181 const { editor } = await getContainerForSelector(selector, inspector); 182 183 for (const { attributeName, links } of attributes) { 184 info("Testing attribute " + attributeName); 185 const linkEls = editor.attrElements 186 .get(attributeName) 187 .querySelectorAll(".link"); 188 189 is(linkEls.length, links.length, "The right number of links were found"); 190 191 for (let i = 0; i < links.length; i++) { 192 const linkEl = linkEls[i]; 193 const type = linkEl.dataset.type; 194 195 is(type, links[i].type, `Link ${i} has the right type`); 196 is(linkEl.textContent, links[i].value, `Link ${i} has the right value`); 197 198 const selectNodeButton = linkEl.querySelector("button.select-node"); 199 if (type === "idref" || type === "idreflist") { 200 ok(selectNodeButton, `Link ${i} has an expected Select Node button`); 201 } else { 202 is( 203 selectNodeButton, 204 null, 205 `Link ${i} does not have a Select Node button` 206 ); 207 } 208 } 209 } 210 } 211 });