From a510c6a37f78cfaa43c9ed65683374af5baf4929 Mon Sep 17 00:00:00 2001 From: Tan Li Hau Date: Wed, 17 Apr 2024 17:10:24 +0800 Subject: [PATCH] fix: support attribute selector inside :global() (#11135) * fix: support attribute selector inside :global() * Update Selector.js --- .changeset/tricky-onions-double.md | 5 +++++ packages/svelte/src/compiler/compile/css/Selector.js | 2 +- .../test/css/samples/global-attribute-selctor/expected.css | 1 + .../test/css/samples/global-attribute-selctor/input.svelte | 6 ++++++ .../samples/css-invalid-global-placement-6/errors.json | 1 + .../samples/css-invalid-global-placement-6/input.svelte | 6 ++++++ 6 files changed, 20 insertions(+), 1 deletion(-) create mode 100644 .changeset/tricky-onions-double.md create mode 100644 packages/svelte/test/css/samples/global-attribute-selctor/expected.css create mode 100644 packages/svelte/test/css/samples/global-attribute-selctor/input.svelte create mode 100644 packages/svelte/test/validator/samples/css-invalid-global-placement-6/errors.json create mode 100644 packages/svelte/test/validator/samples/css-invalid-global-placement-6/input.svelte diff --git a/.changeset/tricky-onions-double.md b/.changeset/tricky-onions-double.md new file mode 100644 index 0000000000..4245e7814d --- /dev/null +++ b/.changeset/tricky-onions-double.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +support attribute selector inside :global() diff --git a/packages/svelte/src/compiler/compile/css/Selector.js b/packages/svelte/src/compiler/compile/css/Selector.js index a1c58515d7..9593d1ed63 100644 --- a/packages/svelte/src/compiler/compile/css/Selector.js +++ b/packages/svelte/src/compiler/compile/css/Selector.js @@ -214,7 +214,7 @@ export default class Selector { index !== 0 && selector.children && selector.children.length > 0 && - !/[.:#\s]/.test(selector.children[0].value[0]) + !/[.:#[\s]/.test(selector.children[0].value[0]) ) { component.error(selector, compiler_errors.css_invalid_global_selector_position); } diff --git a/packages/svelte/test/css/samples/global-attribute-selctor/expected.css b/packages/svelte/test/css/samples/global-attribute-selctor/expected.css new file mode 100644 index 0000000000..f8ae79fe50 --- /dev/null +++ b/packages/svelte/test/css/samples/global-attribute-selctor/expected.css @@ -0,0 +1 @@ +.anim-checkbox.svelte-xyz[data-state='checked']{background-color:red} \ No newline at end of file diff --git a/packages/svelte/test/css/samples/global-attribute-selctor/input.svelte b/packages/svelte/test/css/samples/global-attribute-selctor/input.svelte new file mode 100644 index 0000000000..f821f82fc6 --- /dev/null +++ b/packages/svelte/test/css/samples/global-attribute-selctor/input.svelte @@ -0,0 +1,6 @@ + +
\ No newline at end of file diff --git a/packages/svelte/test/validator/samples/css-invalid-global-placement-6/errors.json b/packages/svelte/test/validator/samples/css-invalid-global-placement-6/errors.json new file mode 100644 index 0000000000..fe51488c70 --- /dev/null +++ b/packages/svelte/test/validator/samples/css-invalid-global-placement-6/errors.json @@ -0,0 +1 @@ +[] diff --git a/packages/svelte/test/validator/samples/css-invalid-global-placement-6/input.svelte b/packages/svelte/test/validator/samples/css-invalid-global-placement-6/input.svelte new file mode 100644 index 0000000000..f821f82fc6 --- /dev/null +++ b/packages/svelte/test/validator/samples/css-invalid-global-placement-6/input.svelte @@ -0,0 +1,6 @@ + +
\ No newline at end of file