browser_markup_navigation.js (3928B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Test that the markup-view nodes can be navigated to with the keyboard 7 8 const TEST_URL = URL_ROOT + "doc_markup_navigation.html"; 9 const TEST_DATA = [ 10 ["KEY_PageUp", "*doctype*"], 11 ["KEY_ArrowDown", "html"], 12 ["KEY_ArrowDown", "head"], 13 ["KEY_ArrowDown", "body"], 14 ["KEY_ArrowDown", "node0"], 15 ["KEY_ArrowRight", "node0"], 16 ["KEY_ArrowDown", "node1"], 17 ["KEY_ArrowDown", "node2"], 18 ["KEY_ArrowDown", "node3"], 19 ["KEY_ArrowDown", "*comment*"], 20 ["KEY_ArrowDown", "node4"], 21 ["KEY_ArrowRight", "node4"], 22 ["KEY_ArrowDown", "*text*"], 23 ["KEY_ArrowDown", "node5"], 24 ["KEY_ArrowDown", "*text*"], 25 ["KEY_ArrowDown", "node6"], 26 ["KEY_ArrowDown", "*text*"], 27 ["KEY_ArrowDown", "*comment*"], 28 ["KEY_ArrowDown", "node7"], 29 ["KEY_ArrowRight", "node7"], 30 ["KEY_ArrowDown", "*text*"], 31 ["KEY_ArrowDown", "node8"], 32 ["KEY_ArrowLeft", "node7"], 33 ["KEY_ArrowLeft", "node7"], 34 ["KEY_ArrowRight", "node7"], 35 ["KEY_ArrowRight", "*text*"], 36 ["KEY_ArrowDown", "node8"], 37 ["KEY_ArrowDown", "*text*"], 38 ["KEY_ArrowDown", "node9"], 39 ["KEY_ArrowDown", "*text*"], 40 ["KEY_ArrowDown", "node10"], 41 ["KEY_ArrowDown", "*text*"], 42 ["KEY_ArrowDown", "node11"], 43 ["KEY_ArrowDown", "*text*"], 44 ["KEY_ArrowDown", "node12"], 45 ["KEY_ArrowRight", "node12"], 46 ["KEY_ArrowDown", "*text*"], 47 ["KEY_ArrowDown", "node13"], 48 ["KEY_ArrowDown", "node14"], 49 ["KEY_ArrowDown", "node15"], 50 ["KEY_ArrowDown", "node15"], 51 ["KEY_ArrowDown", "node15"], 52 ["KEY_ArrowUp", "node14"], 53 ["KEY_ArrowUp", "node13"], 54 ["KEY_ArrowUp", "*text*"], 55 ["KEY_ArrowUp", "node12"], 56 ["KEY_ArrowLeft", "node12"], 57 ["KEY_ArrowDown", "node14"], 58 ["KEY_Home", "*doctype*"], 59 ["KEY_PageDown", "*text*"], 60 ["KEY_ArrowDown", "node5"], 61 ["KEY_ArrowDown", "*text*"], 62 ["KEY_ArrowDown", "node6"], 63 ["KEY_ArrowDown", "*text*"], 64 ["KEY_ArrowDown", "*comment*"], 65 ["KEY_ArrowDown", "node7"], 66 ["KEY_ArrowLeft", "node7"], 67 ["KEY_ArrowDown", "*text*"], 68 ["KEY_ArrowDown", "node9"], 69 ["KEY_ArrowDown", "*text*"], 70 ["KEY_ArrowDown", "node10"], 71 ["KEY_PageUp", "*text*"], 72 ["KEY_PageUp", "*doctype*"], 73 ["KEY_ArrowDown", "html"], 74 ["KEY_ArrowLeft", "html"], 75 ["KEY_ArrowDown", "head"], 76 ]; 77 78 add_task(async function () { 79 const { inspector } = await openInspectorForURL(TEST_URL); 80 81 info("Making sure the markup-view frame is focused"); 82 inspector.markup._frame.focus(); 83 84 info("Starting to iterate through the test data"); 85 for (const [key, className] of TEST_DATA) { 86 info("Testing step: " + key + " to navigate to " + className); 87 EventUtils.synthesizeKey(key); 88 89 info("Making sure markup-view children get updated"); 90 await waitForChildrenUpdated(inspector); 91 92 info("Checking the right node is selected"); 93 checkSelectedNode(key, className, inspector); 94 } 95 96 // In theory, we should wait for the inspector-updated event at each iteration 97 // of the previous loop where we expect the current node to change (because 98 // changing the current node ends up refreshing the rule-view, breadcrumbs, 99 // ...), but this would make this test a *lot* slower. Instead, having a final 100 // catch-all event works too. 101 await inspector.once("inspector-updated"); 102 }); 103 104 function checkSelectedNode(key, className, inspector) { 105 const node = inspector.selection.nodeFront; 106 107 if (className == "*comment*") { 108 is( 109 node.nodeType, 110 Node.COMMENT_NODE, 111 "Found a comment after pressing " + key 112 ); 113 } else if (className == "*text*") { 114 is(node.nodeType, Node.TEXT_NODE, "Found text after pressing " + key); 115 } else if (className == "*doctype*") { 116 is( 117 node.nodeType, 118 Node.DOCUMENT_TYPE_NODE, 119 "Found the doctype after pressing " + key 120 ); 121 } else { 122 is( 123 node.className, 124 className, 125 "Found node: " + className + " after pressing " + key 126 ); 127 } 128 }