| <!doctype HTML> |
| <html> |
| <meta charset="utf8"> |
| <title>Display Locking: activatable allows selections (reference)</title> |
| <link rel="author" title="Rakina Zata Amni" href="mailto:rakina@chromium.org"> |
| <link rel="help" href="https://github.com/WICG/display-locking"> |
| <style> |
| div { |
| contain: style layout; |
| } |
| #nonActivatable { |
| width: 20px; height: 20px; |
| } |
| #userSelectNone { |
| width: 30px; height: 30px; |
| } |
| </style> |
| <div id="neighbor"> |
| neighbor |
| </div> |
| <div id="container"> |
| <div> |
| not locked! |
| </div> |
| <div id="nonActivatable"> |
| </div> |
| <div id="userSelectNone"> |
| </div> |
| <div id="nested"> |
| nested activatable locked |
| </div> |
| </div> |
| <script> |
| window.getSelection().removeAllRanges(); |
| const selectionRange = document.createRange(); |
| selectionRange.setStart(neighbor.firstChild, 4); |
| selectionRange.setEnd(nested.firstChild, 7); |
| window.getSelection().addRange(selectionRange); |
| </script> |
