Skip to content

Inlined CSS from <link> does not work due to CORS #14598

@billyvg

Description

@billyvg

We have a customer that is loading CSS via:

<link rel="stylesheet" href="..." crossorigin />

When we record, what happens is:

  • serialize <link> element, (stylesheet is not loaded in document yet, so this code does not run)
  • stylesheet gets loaded
  • serializeElementNode is called again, this time there is css that is written to _cssText attribute (rel and href attrs are deleted)
    • This is recorded as a mutation to the original link element

During playback:

  • The <link> is added to DOM with origin attributes
  • Browser blocks access to CSS file due to CORS
  • Mutation occurs with _cssText
  • Styles in _cssText are not loaded into DOM

This results in a replay without any CSS loaded.

Metadata

Metadata

Assignees

Labels

BugPackage: replayIssues related to the Sentry Replay SDK

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions