diff --git a/src/css/Selector.ts b/src/css/Selector.ts index 5a7c2f1729..57fcb837e8 100644 --- a/src/css/Selector.ts +++ b/src/css/Selector.ts @@ -160,7 +160,7 @@ function applySelector(blocks: Block[], node: Node, stack: Node[], toEncapsulate } else if (selector.type === 'AttributeSelector') { - if (!attributeMatches(node, selector.name.name, selector.value && unquote(selector.value.value), selector.operator, selector.flags)) return false; + if (!attributeMatches(node, selector.name.name, selector.value && unquote(selector.value), selector.operator, selector.flags)) return false; } else if (selector.type === 'TypeSelector') { @@ -245,10 +245,13 @@ function isDynamic(value: Node) { return value.length > 1 || value[0].type !== 'Text'; } -function unquote(str: string) { +function unquote(value: Node) { + if (value.type === 'Identifier') return value.name; + const str = value.value; if (str[0] === str[str.length - 1] && str[0] === "'" || str[0] === '"') { return str.slice(1, str.length - 1); } + return str; } class Block { diff --git a/test/css/samples/attribute-selector-unquoted/_config.js b/test/css/samples/attribute-selector-unquoted/_config.js new file mode 100644 index 0000000000..b37866f9b6 --- /dev/null +++ b/test/css/samples/attribute-selector-unquoted/_config.js @@ -0,0 +1,3 @@ +export default { + cascade: false +}; \ No newline at end of file diff --git a/test/css/samples/attribute-selector-unquoted/expected.css b/test/css/samples/attribute-selector-unquoted/expected.css new file mode 100644 index 0000000000..b52e52d545 --- /dev/null +++ b/test/css/samples/attribute-selector-unquoted/expected.css @@ -0,0 +1 @@ +[foo=bar][svelte-xyz]{color:red} \ No newline at end of file diff --git a/test/css/samples/attribute-selector-unquoted/input.html b/test/css/samples/attribute-selector-unquoted/input.html new file mode 100644 index 0000000000..c3931d79d5 --- /dev/null +++ b/test/css/samples/attribute-selector-unquoted/input.html @@ -0,0 +1,7 @@ +
+ + \ No newline at end of file