From 0bfcb2d5a544a09c94a7d6ca637f05271fa270ce Mon Sep 17 00:00:00 2001
From: Eelco Lempsink <eelco@lempsink.nl>
Date: Sun, 14 Jan 2024 03:42:25 +0100
Subject: [PATCH] Fix css embed in JSX when using (only) a spread attribute
 (#15896)

---
 changelog_unreleased/javascript/15896.md          |  8 ++++++++
 src/language-js/embed/css.js                      |  3 ++-
 .../jsx/embed/__snapshots__/jsfmt.spec.js.snap    | 15 +++++++++++++++
 tests/format/jsx/embed/css-embed.js               |  1 +
 tests/format/jsx/embed/jsfmt.spec.js              |  1 +
 5 files changed, 27 insertions(+), 1 deletion(-)
 create mode 100644 changelog_unreleased/javascript/15896.md
 create mode 100644 tests/format/jsx/embed/__snapshots__/jsfmt.spec.js.snap
 create mode 100644 tests/format/jsx/embed/css-embed.js
 create mode 100644 tests/format/jsx/embed/jsfmt.spec.js

diff --git a/changelog_unreleased/javascript/15896.md b/changelog_unreleased/javascript/15896.md
new file mode 100644
index 000000000..1ae1ed20c
--- /dev/null
+++ b/changelog_unreleased/javascript/15896.md
@@ -0,0 +1,8 @@
+#### Fix crash when parsing template literal CSS in a JSX style tag using a spread attribute (#15896 by @eelco)
+
+For example this code would crash before:
+
+<!-- prettier-ignore -->
+```jsx
+<style {...spread}>{`.{}`}</style>
+```
diff --git a/src/language-js/embed/css.js b/src/language-js/embed/css.js
index d6be30bce..317876469 100644
--- a/src/language-js/embed/css.js
+++ b/src/language-js/embed/css.js
@@ -75,7 +75,8 @@ function isStyledJsx({ node, parent, grandparent }) {
       grandparent.type === "JSXElement" &&
       grandparent.openingElement.name.name === "style" &&
       grandparent.openingElement.attributes.some(
-        (attribute) => attribute.name.name === "jsx",
+        (attribute) =>
+          attribute.type === "JSXAttribute" && attribute.name.name === "jsx",
       )) ||
     (parent?.type === "TaggedTemplateExpression" &&
       parent.tag.type === "Identifier" &&
diff --git a/tests/format/jsx/embed/__snapshots__/jsfmt.spec.js.snap b/tests/format/jsx/embed/__snapshots__/jsfmt.spec.js.snap
new file mode 100644
index 000000000..e096fd364
--- /dev/null
+++ b/tests/format/jsx/embed/__snapshots__/jsfmt.spec.js.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`css-embed.js format 1`] = `
+====================================options=====================================
+parsers: ["flow", "babel"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+<style {...spread}>{\`.{}\`}</style>;
+
+=====================================output=====================================
+<style {...spread}>{\`.{}\`}</style>;
+
+================================================================================
+`;
diff --git a/tests/format/jsx/embed/css-embed.js b/tests/format/jsx/embed/css-embed.js
new file mode 100644
index 000000000..95ac143ca
--- /dev/null
+++ b/tests/format/jsx/embed/css-embed.js
@@ -0,0 +1 @@
+<style {...spread}>{`.{}`}</style>;
diff --git a/tests/format/jsx/embed/jsfmt.spec.js b/tests/format/jsx/embed/jsfmt.spec.js
new file mode 100644
index 000000000..04b1a619e
--- /dev/null
+++ b/tests/format/jsx/embed/jsfmt.spec.js
@@ -0,0 +1 @@
+run_spec(import.meta, ["flow", "babel"]);