fix: empty value attribute selector doesn't produce "Unused CSS selector" warning (#8122)

Fixes: #8042

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Yuichiro Yamashita <xydybaseball@gmail.com>

src/compiler/compile/css/Selector.ts

@@ -350,7 +350,7 @@ function attribute_matches(node: CssNode, name: string, expected_value: string,
 	const attr = node.attributes.find((attr: CssNode) => attr.name === name);
 	if (!attr) return false;
 	if (attr.is_true) return operator === null;
-	if (!expected_value) return true;
+	if (expected_value == null) return true;
 
 	if (attr.chunks.length === 1) {
 		const value = attr.chunks[0];

test/css/samples/unused-selector-empty-attribute/_config.js

@@ -0,0 +1,25 @@
+export default {
+	warnings: [{
+		filename: 'SvelteComponent.svelte',
+		code: 'css-unused-selector',
+		message: 'Unused CSS selector "img[alt=""]"',
+		start: {
+			character: 87,
+			column: 1,
+			line: 8
+		  },
+		end: {
+			character: 98,
+			column: 12,
+			line: 8
+		  },
+		pos: 87,
+		frame: `
+			 6:   }
+			 7:
+			 8:   img[alt=""] {
+			      ^
+			 9:     border: 1px solid red;
+			10:   }`
+	}]
+};

test/css/samples/unused-selector-empty-attribute/expected.css

@@ -0,0 +1 @@
+img[alt].svelte-xyz{border:1px solid green}

test/css/samples/unused-selector-empty-attribute/expected.html

@@ -0,0 +1 @@
+<img alt="a foo" class="svelte-xyz" src="foo.jpg">

test/css/samples/unused-selector-empty-attribute/input.svelte

@@ -0,0 +1,11 @@
+<img src="foo.jpg" alt="a foo" />
+
+<style>
+	img[alt] {
+		border: 1px solid green;
+	}
+
+	img[alt=""] {
+		border: 1px solid red;
+	}
+</style>