blob: 8f6e4ea3941844d6d9133d5d12cca2cce3d9be3e [file] [log] [blame]
<!DOCTYPE html>
<html>
<body>
<p id="description">This tests copying and pasting content across shadow boundaries.<br>
To test manually, copy text blow starting from "hello" ending with "Web", and paste into the green box below. All the text shoul be copied & pasted.</p>
<style> .box { border: solid 1px; padding: 0.2rem; margin-bottom: 1rem; } </style>
<div id="source" class="box" style="border-color: blue">hello <span id="host">world</span> rocks</div>
<div id="destination" class="box" style="border-color: blue" contenteditable></div>
<pre id="htmlResult"></pre>
<pre id="textResult"></pre>
<script src="../../resources/dump-as-markup.js"></script>
<script>
Markup.description(description.textContent);
Markup.waitUntilDone();
const shadowRoot = host.attachShadow({mode: 'open'});
shadowRoot.innerHTML = '<slot></slot> WebKit';
destination.addEventListener('paste', (event) => {
htmlResult.textContent = event.clipboardData.getData('text/html');
textResult.textContent = event.clipboardData.getData('text/plain');
setTimeout(() => {
Markup.dump(destination, 'pasted html');
Markup.dump(textResult, 'text/plain');
Markup.notifyDone();
}, 0);
});
if (window.testRunner) {
internals.setSelectionWithoutValidation(source, 0, shadowRoot.lastChild, shadowRoot.lastChild.data.indexOf('Kit'));
document.execCommand('copy');
destination.focus();
document.execCommand('paste');
}
</script>
</body>
</html>