From 45a54c1aa4ef7221bff85dcbf14592f3afdbb3ce Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Fri, 2 Aug 2019 19:31:04 -0400
Subject: [PATCH] use bindings when matching attribute selector against element
 (#3281)

---
 src/compiler/compile/css/Selector.ts                  |  2 ++
 test/css/samples/attribute-selector-bind/expected.css |  1 +
 test/css/samples/attribute-selector-bind/input.svelte | 11 +++++++++++
 3 files changed, 14 insertions(+)
 create mode 100644 test/css/samples/attribute-selector-bind/expected.css
 create mode 100644 test/css/samples/attribute-selector-bind/input.svelte

diff --git a/src/compiler/compile/css/Selector.ts b/src/compiler/compile/css/Selector.ts
index ef54f789fc..0d4ea82bb5 100644
--- a/src/compiler/compile/css/Selector.ts
+++ b/src/compiler/compile/css/Selector.ts
@@ -219,6 +219,8 @@ function attribute_matches(node: Node, name: string, expected_value: string, ope
 	const spread = node.attributes.find(attr => attr.type === 'Spread');
 	if (spread) return true;
 
+	if (node.bindings.some((binding: Node) => binding.name === name)) return true;
+
 	const attr = node.attributes.find((attr: Node) => attr.name === name);
 	if (!attr) return false;
 	if (attr.is_true) return operator === null;
diff --git a/test/css/samples/attribute-selector-bind/expected.css b/test/css/samples/attribute-selector-bind/expected.css
new file mode 100644
index 0000000000..20543c5c8e
--- /dev/null
+++ b/test/css/samples/attribute-selector-bind/expected.css
@@ -0,0 +1 @@
+details[open].svelte-xyz{color:red}
\ No newline at end of file
diff --git a/test/css/samples/attribute-selector-bind/input.svelte b/test/css/samples/attribute-selector-bind/input.svelte
new file mode 100644
index 0000000000..eb1d03e762
--- /dev/null
+++ b/test/css/samples/attribute-selector-bind/input.svelte
@@ -0,0 +1,11 @@
+<script>
+	let open = false;
+</script>
+
+<details bind:open>Hello</details>
+
+<style>
+	details[open] {
+		color: red;
+	}
+</style>