more

packages/styled/__tests__/__snapshots__/edge-cases.js.snap

@@ -9,7 +9,7 @@ exports[`nested function using css 1`] = `
 }
 
 <div
-  className="emotion-0"
+  class="emotion-0"
 />
 `;
 
@@ -30,6 +30,6 @@ exports[`nested function using css and keyframes 1`] = `
 }
 
 <div
-  className="emotion-0"
+  class="emotion-0"
 />
 `;

packages/styled/__tests__/edge-cases.js

@@ -1,11 +1,10 @@
 import 'test-utils/setup-env'
 import React from 'react'
-import { act } from 'react'
-import renderer from 'react-test-renderer'
+import { render } from '@testing-library/react'
 import styled from '@emotion/styled'
 import { css, keyframes } from '@emotion/react'
 
-test('nested function using css', async () => {
+test('nested function using css', () => {
   let Comp = styled.div`
     color: blue;
     border: 2px solid #000;
@@ -14,12 +13,12 @@ test('nested function using css', async () => {
     `};
     padding: 30px;
   `
-  const tree = await act(() => renderer.create(<Comp />))
+  const { container } = render(<Comp />)
 
-  expect(tree.toJSON()).toMatchSnapshot()
+  expect(container.firstChild).toMatchSnapshot()
 })
 
-test('nested function using css and keyframes', async () => {
+test('nested function using css and keyframes', () => {
   let Comp = styled.div`
     ${() => css`
       animation: ${keyframes({
@@ -30,7 +29,7 @@ test('nested function using css and keyframes', async () => {
       })};
     `};
   `
-  const tree = await act(() => renderer.create(<Comp />))
+  const { container } = render(<Comp />)
 
-  expect(tree.toJSON()).toMatchSnapshot()
+  expect(container.firstChild).toMatchSnapshot()
 })

packages/styled/test/__snapshots__/source-map.test.js.snap

@@ -8,10 +8,16 @@ exports[`inserts source map 1`] = `
       data-s=""
     >
 
-      .css-xdvew0-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgYWN0IH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHJlbmRlcmVyIGZyb20gJ3JlYWN0LXRlc3QtcmVuZGVyZXInXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsIGFzeW5jICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAgLz4pKVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIGNvbXBvbmVudCcsIGFzeW5jICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIGxldCBDb21wMiA9IHN0eWxlZChDb21wKWBcbiAgICBiYWNrZ3JvdW5kOiB5ZWxsb3c7XG4gIGBcbiAgYXdhaXQgYWN0KCgpID0+IHJlbmRlcmVyLmNyZWF0ZSg8Q29tcDIgLz4pKVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIHN0eWxlJywgYXN5bmMgKCkgPT4ge1xuICBsZXQgc3R5bGUgPSBjc3MoeyBjb2xvcjogJ2dyZWVuJyB9KVxuICBsZXQgQ29tcDIgPSBzdHlsZWQuZGl2YFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgICAke3N0eWxlfVxuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAyIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
+      .css-baf0kh-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IHJlbmRlciB9IGZyb20gJ0B0ZXN0aW5nLWxpYnJhcnkvcmVhY3QnXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIHJlbmRlcig8Q29tcCAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBjb21wb25lbnQnLCAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBsZXQgQ29tcDIgPSBzdHlsZWQoQ29tcClgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICBgXG4gIHJlbmRlcig8Q29tcDIgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuXG50ZXN0KCdzb3VyY2UgbWFwIHdpdGggY29tcG9zZWQgc3R5bGUnLCAoKSA9PiB7XG4gIGxldCBzdHlsZSA9IGNzcyh7IGNvbG9yOiAnZ3JlZW4nIH0pXG4gIGxldCBDb21wMiA9IHN0eWxlZC5kaXZgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICAgICR7c3R5bGV9XG4gIGBcbiAgcmVuZGVyKDxDb21wMiAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
     </style>
   </head>
-  <body />
+  <body>
+    <div>
+      <div
+        class="css-baf0kh-Comp e1gz73mp3"
+      />
+    </div>
+  </body>
 </html>
 `;
 
@@ -23,17 +29,23 @@ exports[`source map with composed component 1`] = `
       data-s=""
     >
 
-      .css-xdvew0-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgYWN0IH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHJlbmRlcmVyIGZyb20gJ3JlYWN0LXRlc3QtcmVuZGVyZXInXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsIGFzeW5jICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAgLz4pKVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIGNvbXBvbmVudCcsIGFzeW5jICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIGxldCBDb21wMiA9IHN0eWxlZChDb21wKWBcbiAgICBiYWNrZ3JvdW5kOiB5ZWxsb3c7XG4gIGBcbiAgYXdhaXQgYWN0KCgpID0+IHJlbmRlcmVyLmNyZWF0ZSg8Q29tcDIgLz4pKVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIHN0eWxlJywgYXN5bmMgKCkgPT4ge1xuICBsZXQgc3R5bGUgPSBjc3MoeyBjb2xvcjogJ2dyZWVuJyB9KVxuICBsZXQgQ29tcDIgPSBzdHlsZWQuZGl2YFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgICAke3N0eWxlfVxuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAyIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
+      .css-baf0kh-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IHJlbmRlciB9IGZyb20gJ0B0ZXN0aW5nLWxpYnJhcnkvcmVhY3QnXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIHJlbmRlcig8Q29tcCAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBjb21wb25lbnQnLCAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBsZXQgQ29tcDIgPSBzdHlsZWQoQ29tcClgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICBgXG4gIHJlbmRlcig8Q29tcDIgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuXG50ZXN0KCdzb3VyY2UgbWFwIHdpdGggY29tcG9zZWQgc3R5bGUnLCAoKSA9PiB7XG4gIGxldCBzdHlsZSA9IGNzcyh7IGNvbG9yOiAnZ3JlZW4nIH0pXG4gIGxldCBDb21wMiA9IHN0eWxlZC5kaXZgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICAgICR7c3R5bGV9XG4gIGBcbiAgcmVuZGVyKDxDb21wMiAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
     </style>
     <style
       data-emotion="css"
       data-s=""
     >
 
-      .css-1gvw34f-Comp-Comp2{color:hotpink;background:yellow;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQjBCIiwiZmlsZSI6InNvdXJjZS1tYXAudGVzdC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGFjdCB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCByZW5kZXJlciBmcm9tICdyZWFjdC10ZXN0LXJlbmRlcmVyJ1xuXG50ZXN0KCdpbnNlcnRzIHNvdXJjZSBtYXAnLCBhc3luYyAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBhd2FpdCBhY3QoKCkgPT4gcmVuZGVyZXIuY3JlYXRlKDxDb21wIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBjb21wb25lbnQnLCBhc3luYyAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBsZXQgQ29tcDIgPSBzdHlsZWQoQ29tcClgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAyIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBzdHlsZScsIGFzeW5jICgpID0+IHtcbiAgbGV0IHN0eWxlID0gY3NzKHsgY29sb3I6ICdncmVlbicgfSlcbiAgbGV0IENvbXAyID0gc3R5bGVkLmRpdmBcbiAgICBiYWNrZ3JvdW5kOiB5ZWxsb3c7XG4gICAgJHtzdHlsZX1cbiAgYFxuICBhd2FpdCBhY3QoKCkgPT4gcmVuZGVyZXIuY3JlYXRlKDxDb21wMiAvPikpXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuIl19 */
+      .css-fle4cv-Comp-Comp2{color:hotpink;background:yellow;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQjBCIiwiZmlsZSI6InNvdXJjZS1tYXAudGVzdC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyByZW5kZXIgfSBmcm9tICdAdGVzdGluZy1saWJyYXJ5L3JlYWN0J1xuXG50ZXN0KCdpbnNlcnRzIHNvdXJjZSBtYXAnLCAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICByZW5kZXIoPENvbXAgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuXG50ZXN0KCdzb3VyY2UgbWFwIHdpdGggY29tcG9zZWQgY29tcG9uZW50JywgKCkgPT4ge1xuICBsZXQgQ29tcCA9IHN0eWxlZC5kaXZgXG4gICAgY29sb3I6IGhvdHBpbms7XG4gIGBcbiAgbGV0IENvbXAyID0gc3R5bGVkKENvbXApYFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgYFxuICByZW5kZXIoPENvbXAyIC8+KVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIHN0eWxlJywgKCkgPT4ge1xuICBsZXQgc3R5bGUgPSBjc3MoeyBjb2xvcjogJ2dyZWVuJyB9KVxuICBsZXQgQ29tcDIgPSBzdHlsZWQuZGl2YFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgICAke3N0eWxlfVxuICBgXG4gIHJlbmRlcig8Q29tcDIgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuIl19 */
     </style>
   </head>
-  <body />
+  <body>
+    <div>
+      <div
+        class="css-fle4cv-Comp-Comp2 e1gz73mp1"
+      />
+    </div>
+  </body>
 </html>
 `;
 
@@ -45,23 +57,29 @@ exports[`source map with composed style 1`] = `
       data-s=""
     >
 
-      .css-xdvew0-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgYWN0IH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHJlbmRlcmVyIGZyb20gJ3JlYWN0LXRlc3QtcmVuZGVyZXInXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsIGFzeW5jICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAgLz4pKVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIGNvbXBvbmVudCcsIGFzeW5jICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIGxldCBDb21wMiA9IHN0eWxlZChDb21wKWBcbiAgICBiYWNrZ3JvdW5kOiB5ZWxsb3c7XG4gIGBcbiAgYXdhaXQgYWN0KCgpID0+IHJlbmRlcmVyLmNyZWF0ZSg8Q29tcDIgLz4pKVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIHN0eWxlJywgYXN5bmMgKCkgPT4ge1xuICBsZXQgc3R5bGUgPSBjc3MoeyBjb2xvcjogJ2dyZWVuJyB9KVxuICBsZXQgQ29tcDIgPSBzdHlsZWQuZGl2YFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgICAke3N0eWxlfVxuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAyIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
+      .css-baf0kh-Comp{color:hotpink;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNdUIiLCJmaWxlIjoic291cmNlLW1hcC50ZXN0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IHJlbmRlciB9IGZyb20gJ0B0ZXN0aW5nLWxpYnJhcnkvcmVhY3QnXG5cbnRlc3QoJ2luc2VydHMgc291cmNlIG1hcCcsICgpID0+IHtcbiAgbGV0IENvbXAgPSBzdHlsZWQuZGl2YFxuICAgIGNvbG9yOiBob3RwaW5rO1xuICBgXG4gIHJlbmRlcig8Q29tcCAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBjb21wb25lbnQnLCAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBsZXQgQ29tcDIgPSBzdHlsZWQoQ29tcClgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICBgXG4gIHJlbmRlcig8Q29tcDIgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuXG50ZXN0KCdzb3VyY2UgbWFwIHdpdGggY29tcG9zZWQgc3R5bGUnLCAoKSA9PiB7XG4gIGxldCBzdHlsZSA9IGNzcyh7IGNvbG9yOiAnZ3JlZW4nIH0pXG4gIGxldCBDb21wMiA9IHN0eWxlZC5kaXZgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICAgICR7c3R5bGV9XG4gIGBcbiAgcmVuZGVyKDxDb21wMiAvPilcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG4iXX0= */
     </style>
     <style
       data-emotion="css"
       data-s=""
     >
 
-      .css-1gvw34f-Comp-Comp2{color:hotpink;background:yellow;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQjBCIiwiZmlsZSI6InNvdXJjZS1tYXAudGVzdC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGFjdCB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCByZW5kZXJlciBmcm9tICdyZWFjdC10ZXN0LXJlbmRlcmVyJ1xuXG50ZXN0KCdpbnNlcnRzIHNvdXJjZSBtYXAnLCBhc3luYyAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBhd2FpdCBhY3QoKCkgPT4gcmVuZGVyZXIuY3JlYXRlKDxDb21wIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBjb21wb25lbnQnLCBhc3luYyAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBsZXQgQ29tcDIgPSBzdHlsZWQoQ29tcClgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAyIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBzdHlsZScsIGFzeW5jICgpID0+IHtcbiAgbGV0IHN0eWxlID0gY3NzKHsgY29sb3I6ICdncmVlbicgfSlcbiAgbGV0IENvbXAyID0gc3R5bGVkLmRpdmBcbiAgICBiYWNrZ3JvdW5kOiB5ZWxsb3c7XG4gICAgJHtzdHlsZX1cbiAgYFxuICBhd2FpdCBhY3QoKCkgPT4gcmVuZGVyZXIuY3JlYXRlKDxDb21wMiAvPikpXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuIl19 */
+      .css-fle4cv-Comp-Comp2{color:hotpink;background:yellow;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQjBCIiwiZmlsZSI6InNvdXJjZS1tYXAudGVzdC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyByZW5kZXIgfSBmcm9tICdAdGVzdGluZy1saWJyYXJ5L3JlYWN0J1xuXG50ZXN0KCdpbnNlcnRzIHNvdXJjZSBtYXAnLCAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICByZW5kZXIoPENvbXAgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuXG50ZXN0KCdzb3VyY2UgbWFwIHdpdGggY29tcG9zZWQgY29tcG9uZW50JywgKCkgPT4ge1xuICBsZXQgQ29tcCA9IHN0eWxlZC5kaXZgXG4gICAgY29sb3I6IGhvdHBpbms7XG4gIGBcbiAgbGV0IENvbXAyID0gc3R5bGVkKENvbXApYFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgYFxuICByZW5kZXIoPENvbXAyIC8+KVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIHN0eWxlJywgKCkgPT4ge1xuICBsZXQgc3R5bGUgPSBjc3MoeyBjb2xvcjogJ2dyZWVuJyB9KVxuICBsZXQgQ29tcDIgPSBzdHlsZWQuZGl2YFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgICAke3N0eWxlfVxuICBgXG4gIHJlbmRlcig8Q29tcDIgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuIl19 */
     </style>
     <style
       data-emotion="css"
       data-s=""
     >
 
-      .css-16164n3-Comp2-style{background:yellow;color:green;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQndCIiwiZmlsZSI6InNvdXJjZS1tYXAudGVzdC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGFjdCB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCByZW5kZXJlciBmcm9tICdyZWFjdC10ZXN0LXJlbmRlcmVyJ1xuXG50ZXN0KCdpbnNlcnRzIHNvdXJjZSBtYXAnLCBhc3luYyAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBhd2FpdCBhY3QoKCkgPT4gcmVuZGVyZXIuY3JlYXRlKDxDb21wIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBjb21wb25lbnQnLCBhc3luYyAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICBsZXQgQ29tcDIgPSBzdHlsZWQoQ29tcClgXG4gICAgYmFja2dyb3VuZDogeWVsbG93O1xuICBgXG4gIGF3YWl0IGFjdCgoKSA9PiByZW5kZXJlci5jcmVhdGUoPENvbXAyIC8+KSlcbiAgZXhwZWN0KGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkudG9NYXRjaFNuYXBzaG90KClcbn0pXG5cbnRlc3QoJ3NvdXJjZSBtYXAgd2l0aCBjb21wb3NlZCBzdHlsZScsIGFzeW5jICgpID0+IHtcbiAgbGV0IHN0eWxlID0gY3NzKHsgY29sb3I6ICdncmVlbicgfSlcbiAgbGV0IENvbXAyID0gc3R5bGVkLmRpdmBcbiAgICBiYWNrZ3JvdW5kOiB5ZWxsb3c7XG4gICAgJHtzdHlsZX1cbiAgYFxuICBhd2FpdCBhY3QoKCkgPT4gcmVuZGVyZXIuY3JlYXRlKDxDb21wMiAvPikpXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuIl19 */
+      .css-hulrp8-Comp2-style{background:yellow;color:green;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNvdXJjZS1tYXAudGVzdC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQndCIiwiZmlsZSI6InNvdXJjZS1tYXAudGVzdC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyByZW5kZXIgfSBmcm9tICdAdGVzdGluZy1saWJyYXJ5L3JlYWN0J1xuXG50ZXN0KCdpbnNlcnRzIHNvdXJjZSBtYXAnLCAoKSA9PiB7XG4gIGxldCBDb21wID0gc3R5bGVkLmRpdmBcbiAgICBjb2xvcjogaG90cGluaztcbiAgYFxuICByZW5kZXIoPENvbXAgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuXG50ZXN0KCdzb3VyY2UgbWFwIHdpdGggY29tcG9zZWQgY29tcG9uZW50JywgKCkgPT4ge1xuICBsZXQgQ29tcCA9IHN0eWxlZC5kaXZgXG4gICAgY29sb3I6IGhvdHBpbms7XG4gIGBcbiAgbGV0IENvbXAyID0gc3R5bGVkKENvbXApYFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgYFxuICByZW5kZXIoPENvbXAyIC8+KVxuICBleHBlY3QoZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50KS50b01hdGNoU25hcHNob3QoKVxufSlcblxudGVzdCgnc291cmNlIG1hcCB3aXRoIGNvbXBvc2VkIHN0eWxlJywgKCkgPT4ge1xuICBsZXQgc3R5bGUgPSBjc3MoeyBjb2xvcjogJ2dyZWVuJyB9KVxuICBsZXQgQ29tcDIgPSBzdHlsZWQuZGl2YFxuICAgIGJhY2tncm91bmQ6IHllbGxvdztcbiAgICAke3N0eWxlfVxuICBgXG4gIHJlbmRlcig8Q29tcDIgLz4pXG4gIGV4cGVjdChkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLnRvTWF0Y2hTbmFwc2hvdCgpXG59KVxuIl19 */
     </style>
   </head>
-  <body />
+  <body>
+    <div>
+      <div
+        class="css-hulrp8-Comp2-style e1gz73mp0"
+      />
+    </div>
+  </body>
 </html>
 `;