mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-06-01 18:15:13 +00:00
[fix] StyleSheet hydration with single quotes in attribute selectors
Edge uses single quotes for attribute selectors. Fix #1317 Close #1415
This commit is contained in:
committed by
Nicolas Gallagher
parent
ebbade3a6f
commit
96a23c1c21
Vendored
+20
@@ -86,5 +86,25 @@ describe('createOrderedCSSStyleSheet', () => {
|
|||||||
const clientSheet = createOrderedCSSStyleSheet(element.sheet);
|
const clientSheet = createOrderedCSSStyleSheet(element.sheet);
|
||||||
expect(clientSheet.getTextContent()).toMatchSnapshot();
|
expect(clientSheet.getTextContent()).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('works when the group marker is in single quotes', () => {
|
||||||
|
// Setup SSR CSS
|
||||||
|
const serverSheet = createOrderedCSSStyleSheet();
|
||||||
|
serverSheet.insert('.a { color: red }', 0);
|
||||||
|
serverSheet.insert('.b { color: red }', 1);
|
||||||
|
const textContent = serverSheet.getTextContent().replace(/"/g, "'");
|
||||||
|
|
||||||
|
// Add SSR CSS to client style sheet
|
||||||
|
element.appendChild(document.createTextNode(textContent));
|
||||||
|
const clientSheet = createOrderedCSSStyleSheet(element.sheet);
|
||||||
|
clientSheet.insert('.c { color: red }', 0);
|
||||||
|
expect(clientSheet.getTextContent()).toMatchInlineSnapshot(`
|
||||||
|
"[stylesheet-group='0'] {}
|
||||||
|
.a {color: red;}
|
||||||
|
.c { color: red }
|
||||||
|
[stylesheet-group='1'] {}
|
||||||
|
.b {color: red;}"
|
||||||
|
`);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
+1
-1
@@ -143,7 +143,7 @@ function encodeGroupRule(group) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function decodeGroupRule(cssRule) {
|
function decodeGroupRule(cssRule) {
|
||||||
return Number(cssRule.selectorText.split('"')[1]);
|
return Number(cssRule.selectorText.split(/["']/)[1]);
|
||||||
}
|
}
|
||||||
|
|
||||||
function getOrderedGroups(obj: { [key: number]: any }) {
|
function getOrderedGroups(obj: { [key: number]: any }) {
|
||||||
|
|||||||
Reference in New Issue
Block a user