<!doctype html>
<html lang="en">
<head><meta charset="utf-8"><title>Interaction fixture</title></head>
<body>
    <label for="query">Search</label>
    <input id="query" value="start">
    <button id="replace">Replace input</button>
    <button id="submit">Submit</button>
    <div id="editable" contenteditable="true">editable</div>
    <script>
        document.querySelector('#replace').addEventListener('click', () => {
            const old = document.querySelector('#query');
            const replacement = old.cloneNode();
            replacement.setAttribute('aria-label', 'Replacement');
            old.replaceWith(replacement);
        });
    </script>
</body>
</html>