|
| 1 | +<!DOCTYPE html> |
| 2 | +<!-- |
| 3 | + Copyright 2025 New Relic Corporation. |
| 4 | + PDX-License-Identifier: Apache-2.0 |
| 5 | +--> |
| 6 | +<html> |
| 7 | +<head> |
| 8 | + <title>Session Replay</title> |
| 9 | + {init} {config} |
| 10 | + <script> |
| 11 | + localStorage.clear() |
| 12 | + NREUM.init.session_replay = {enabled: true, collect_fonts: true} |
| 13 | + NREUM.init.privacy.cookies_enabled = true |
| 14 | + </script> |
| 15 | + {loader} |
| 16 | +</head> |
| 17 | +<body> |
| 18 | + This is a page intended to "manually" set up session replay and will always record! |
| 19 | + <hr /> |
| 20 | + <hr /> |
| 21 | + <div class="input-group"> |
| 22 | + <span class="input-group-text">With textarea</span> |
| 23 | + <textarea class="form-control" aria-label="With textarea"></textarea> |
| 24 | + <input type="text" value="test"> |
| 25 | + <input type="password" value="mypassword"> |
| 26 | + </div> |
| 27 | + <div id="content-editable-div" contenteditable="true">Content Editable Div</div> |
| 28 | + <hr /> |
| 29 | + <div id="test"> |
| 30 | + </div> |
| 31 | + <img src="https://upload.wikimedia.org/wikipedia/commons/d/d7/House_of_Commons_Chamber_1.png" /> |
| 32 | + <script> |
| 33 | + /* |
| 34 | + This is a repro of https://github.com/rrweb-io/rrweb/issues/1575 that deals with |
| 35 | + rrweb snapshots corrupting CSS data in v2.0.0-alpha.17 |
| 36 | + */ |
| 37 | + function addStyles() { |
| 38 | + const testDiv = document.getElementById('test') |
| 39 | + let y = document.createElement("style"); |
| 40 | + document.head.appendChild(y); |
| 41 | + for (let i = 0; i < 10; i++) { |
| 42 | + const div = document.createElement("div"); |
| 43 | + div.id = `div-${i}`; |
| 44 | + div.class = 'nr-unmask'; |
| 45 | + div.innerHTML = `This is a test div ${i}`; |
| 46 | + testDiv.appendChild(div); |
| 47 | + |
| 48 | + const styleName = `#div-${i}` |
| 49 | + y.append(document.createTextNode("/*************************************/")) |
| 50 | + // the following CSS would be recorded as-is but rrweb's parser would consider it invalid CSS, resulting in broken replay |
| 51 | + y.append(document.createTextNode(styleName + " { ")); |
| 52 | + y.append(document.createTextNode(" color: blue; ")); |
| 53 | + y.append(document.createTextNode("}")); |
| 54 | + y.append(document.createTextNode("/*************************************/")) |
| 55 | + } |
| 56 | + } |
| 57 | + addStyles() |
| 58 | + </script> |
| 59 | +</body> |
| 60 | +</html> |
0 commit comments