improvements to <link rel="stylesheet"> + mutations#1483

Draft

eoghanmurray wants to merge 26 commits intorrweb-io:masterfrom eoghanmurray:stylesheet-preload

+1,775-527

Commits on May 22, 2024

Unrelated, but the presence of a blank <style></style> element when checking the replay took me ages to debug as I thought it was something I introducedg
eoghanmurray
committed
Add motivating test which can be used against this PR as well as in rrweb-io#1417
eoghanmurray
committed
Recognize that snapshot.ts::serializeTextNode does important work for mutations with absoluteToStylesheet - I had accidentally removed that with initial work
eoghanmurray
committed
Prep PR for async <style> serialization via assets: refactor stringifyStylesheet to happen in a single place during initial snapshot.
eoghanmurray
committed
Add a test to show how mutations on multiple text nodes within the <style> need to be tracked
eoghanmurray
committed
Multiple <style> text children: Demonstrate a failing test as CSS wasn't being assigned to correct text node, and provide remedy whereby css text is properly re-split upon rebuild
eoghanmurray
committed
Add test and remedy for the most trivial type of failure of findCssTextSplits
eoghanmurray
committed
Missed this which is 'happy path' - add a test to catch catch case
eoghanmurray
committed
Create single-style-capture.md
eoghanmurray
committed
An expected test change as per this PR; must have missed it first time round
eoghanmurray
committed
More expected test changes I missed when authoring PR
eoghanmurray
committed
New function buildStyleNode to better encapsulate the separate behaviour there and some explanatory comments
eoghanmurray
committed
Revert an accidental reordering
eoghanmurray
committed
Add the css text length to the splits array as a method of checking that the css hasn't been altered server-side/in-transit
eoghanmurray
committed
Refactor out applyCssSplits for clarity and so we can test it
eoghanmurray
committed
Add more tests and fix bug that was causing css text to end up in the second text child instead of the first
eoghanmurray
committed
The _cssTextSplits should only apply to <style> elements
eoghanmurray
committed
Realize we don't actually need to look at the .sheet during a mutation, even if there is only one text element on the <style>.
eoghanmurray
committed
Fix the following typing problem in the tests:
eoghanmurray
committed
Highlight that there is a replayer involved in these tests
eoghanmurray
committed
Demonstrate that rrweb-io#1374 caused stylesheet contents to be captured twice after a mutation to rel="stylesheet" from rel="preload"
eoghanmurray
committed
Avoid the double call to onStylesheetLoad
eoghanmurray
committed
Remove isStylesheetLoaded function not used since rrweb-io#995
eoghanmurray
committed
Move responsibility for stylesheet onload event from rrweb-snapshot to rrweb/src/record/asset-manager.ts
eoghanmurray
committed
Add test as I realize that serializeNode was doing more work in terms of looking at config
eoghanmurray
committed
WIP: An oddity in that it has a .sheet in the mutation , before the load event ... what if the load event has already fired in some browsers (or if the mutation event is delayed)
eoghanmurray
committed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

improvements to <link rel="stylesheet"> + mutations#1483

Commits on May 22, 2024

Unrelated, but the presence of a blank `<style></style>` element when checking the replay took me ages to debug as I thought it was something I introducedg

Add motivating test which can be used against this PR as well as in rrweb-io#1417

Recognize that snapshot.ts::serializeTextNode does important work for mutations with `absoluteToStylesheet` - I had accidentally removed that with initial work

Prep PR for async <style> serialization via assets: refactor stringifyStylesheet to happen in a single place during initial snapshot.

Add a test to show how mutations on multiple text nodes within the <style> need to be tracked

Multiple <style> text children: Demonstrate a failing test as CSS wasn't being assigned to correct text node, and provide remedy whereby css text is properly re-split upon rebuild

Add test and remedy for the most trivial type of failure of `findCssTextSplits`

Missed this which is 'happy path' - add a test to catch catch case

Create single-style-capture.md

An expected test change as per this PR; must have missed it first time round

More expected test changes I missed when authoring PR

New function buildStyleNode to better encapsulate the separate behaviour there and some explanatory comments

Revert an accidental reordering

Add the css text length to the splits array as a method of checking that the css hasn't been altered server-side/in-transit

Refactor out `applyCssSplits` for clarity and so we can test it

Add more tests and fix bug that was causing css text to end up in the second text child instead of the first

The _cssTextSplits should only apply to <style> elements

Realize we don't actually need to look at the `.sheet` during a mutation, even if there is only one text element on the <style>.

Fix the following typing problem in the tests:

Highlight that there is a replayer involved in these tests

Demonstrate that rrweb-io#1374 caused stylesheet contents to be captured twice after a mutation to rel="stylesheet" from rel="preload"

Avoid the double call to onStylesheetLoad

Remove `isStylesheetLoaded` function not used since rrweb-io#995

Move responsibility for stylesheet onload event from rrweb-snapshot to rrweb/src/record/asset-manager.ts

Add test as I realize that serializeNode was doing more work in terms of looking at config

WIP: An oddity in that it has a .sheet in the mutation , before the load event ... what if the load event has already fired in some browsers (or if the mutation event is delayed)