fix: The URL involved in the dynamic modification element inline style is not converted to an absolute path #768
Conversation
|
Maybe we need transform all the style attribute here? |
|
Yes, indeed. I'll update it later. |
|
Is this to fix that there are URLs in the
|
champkeh
changed the title
|
@eoghanmurray I wrote some test case for this. |
|
Thanks for the test case! Is this going down the Is it necessary to update your test case with a shorthand one; |
| const newPriority = target.style.getPropertyPriority(pname); | ||
| if ( | ||
| newValue !== old.style.getPropertyValue(pname) || | ||
| newPriority !== old.style.getPropertyPriority(pname) | ||
| ) { | ||
| newValue = transformAttribute( |
There was a problem hiding this comment.
could call absoluteToStylesheet directly here on newValue
There was a problem hiding this comment.
like newValue = attributeToStylesheet(newValue);
There was a problem hiding this comment.
(would need to import attributeToStylesheet and also maybe change it's href attribute to default to getHref() rather than importing getHref also)
| const newPriority = target.style.getPropertyPriority(pname); | ||
| if ( | ||
| newValue !== old.style.getPropertyValue(pname) || | ||
| newPriority !== old.style.getPropertyPriority(pname) | ||
| ) { | ||
| newValue = transformAttribute( |
There was a problem hiding this comment.
(would need to import attributeToStylesheet and also maybe change it's href attribute to default to getHref() rather than importing getHref also)
| @@ -490,12 +490,18 @@ export default class MutationBuffer { | |||
| } | |||
| const styleObj = item.attributes.style as styleAttributeValue; | |||
| for (const pname of Array.from(target.style)) { | |||
| const newValue = target.style.getPropertyValue(pname); | |||
| let newValue = target.style.getPropertyValue(pname); | |||
There was a problem hiding this comment.
Thought we might need to do the transformation here, but you are right to wait til after the comparison.
| <button onclick='addDynamicBackgroundImage()'>add dynamic background image</button> | ||
| <script> | ||
| function addDynamicBackgroundImage() { | ||
| document.querySelector('#div2').style.setProperty('background-image', 'url(dynamic.png)') |
There was a problem hiding this comment.
The images are cute! However they do need to be downloaded by everyone who downloads rrweb ... so they can be removed without affecting the test case (it shouldn't matter for the purposes of the test whether they actually exist)
No description provided.