test_tree_08.html (1979B)
1 <!-- This Source Code Form is subject to the terms of the Mozilla Public 2 - License, v. 2.0. If a copy of the MPL was not distributed with this 3 - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> 4 <!DOCTYPE HTML> 5 <html> 6 <!-- 7 Test that when an item in the Tree component is clicked, it steals focus from 8 other inputs. 9 --> 10 <head> 11 <meta charset="utf-8"> 12 <title>Tree component test</title> 13 <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> 14 <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> 15 <link rel="stylesheet" href="chrome://devtools/skin/light-theme.css" type="text/css"> 16 </head> 17 <body> 18 <pre id="test"> 19 <script src="head.js" type="application/javascript"></script> 20 <script type="application/javascript"> 21 22 'use strict' 23 24 window.onload = async function () { 25 try { 26 const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom"); 27 const { createFactory } = browserRequire("devtools/client/shared/vendor/react"); 28 const Tree = createFactory(browserRequire("devtools/client/shared/components/VirtualizedTree")); 29 30 function renderTree(props) { 31 const treeProps = Object.assign({}, 32 TEST_TREE_INTERFACE, 33 { onFocus: x => renderTree({ focused: x }) }, 34 props 35 ); 36 return ReactDOM.render(Tree(treeProps), window.document.body); 37 } 38 39 const tree = renderTree(); 40 41 const input = document.createElement("input"); 42 document.body.appendChild(input); 43 44 input.focus(); 45 is(document.activeElement, input, "The text input should be focused."); 46 47 document.querySelector(".tree-node").click(); 48 await forceRender(tree); 49 50 isnot(document.activeElement, input, 51 "The input should have had it's focus stolen by clicking on a tree item."); 52 } catch(e) { 53 ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e)); 54 } finally { 55 SimpleTest.finish(); 56 } 57 }; 58 </script> 59 </pre> 60 </body> 61 </html>