Merge pull request #3432 from sveltejs/gh-1830

bail out of style tag optimisation when appropriate
pull/3437/head
Rich Harris 5 years ago committed by GitHub
commit 63a7a37bb7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -110,8 +110,9 @@ function get_style_value(chunks: Array<Text | Expression>) {
let in_url = false; let in_url = false;
let quote_mark = null; let quote_mark = null;
let escaped = false; let escaped = false;
let closed = false;
while (chunks.length) { while (chunks.length && !closed) {
const chunk = chunks.shift(); const chunk = chunks.shift();
if (chunk.type === 'Text') { if (chunk.type === 'Text') {
@ -132,6 +133,7 @@ function get_style_value(chunks: Array<Text | Expression>) {
} else if (char === 'u' && chunk.data.slice(c, c + 4) === 'url(') { } else if (char === 'u' && chunk.data.slice(c, c + 4) === 'url(') {
in_url = true; in_url = true;
} else if (char === ';' && !in_url && !quote_mark) { } else if (char === ';' && !in_url && !quote_mark) {
closed = true;
break; break;
} }

@ -0,0 +1,20 @@
export default {
html: `
<p style="opacity: 0.5; color: red">color: red</p>
`,
test({ assert, component, target, window }) {
const p = target.querySelector('p');
let styles = window.getComputedStyle(p);
assert.equal(styles.opacity, '0.5');
assert.equal(styles.color, 'red');
component.styles = 'font-size: 20px';
styles = window.getComputedStyle(p);
assert.equal(styles.opacity, '0.5');
assert.equal(styles.color, '');
assert.equal(styles.fontSize, '20px');
}
}

@ -0,0 +1,5 @@
<script>
export let styles = `color: red`;
</script>
<p style="opacity: 0.5; {styles}">{styles}</p>
Loading…
Cancel
Save