The baseline is taller than the new snapshot (1168x210 to 1168x90).
Fail
Found multiple elements with the text: Object(2)
Here are the matching elements:
Ignored nodes: comments, script, style
<button
class="preview svelte-1ftvep4"
>
Object(2)
</button>
Ignored nodes: comments, script, style
<button
class="preview svelte-1ftvep4"
>
Object(2)
</button>
(If this is intentional, then use the `*AllBy*` variant of the query (like `queryAllByText`, `getAllByText`, or `findAllByText`)).
Ignored nodes: comments, script, style
<div
id="storybook-root"
>
<div
class="block svelte-12cmxck"
data-testid="json"
id=""
style="border-style: solid; overflow: visible; min-width: min(0px, 100%); border-width: var(--block-border-width);"
>
<div
class="wrap default full svelte-au1olv hide"
style="position: absolute; padding: 0px;"
/>
<button
aria-label="Copy"
aria-roledescription="Copy value"
class="copy-text svelte-6fc7le"
title="copy"
>
<svg
color="currentColor"
viewBox="0 0 33 33"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"
fill="currentColor"
/>
<path
d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"
fill="currentColor"
/>
</svg>
</button>
<div
class="json-holder svelte-6fc7le"
>
<div
class="json-node svelte-1ftvep4 root"
style="--depth: 0;"
>
<div
class="line svelte-1ftvep4"
>
<span
aria-roledescription="Line number 1"
class="line-number svelte-1ftvep4"
data-pseudo-content="1"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Collapse"
class="toggle svelte-1ftvep4"
data-pseudo-content="▼"
/>
<span
class="punctuation bracket svelte-1ftvep4"
>
{
</span>
</span>
</div>
<div
class="children svelte-1ftvep4"
>
<div
class="json-node svelte-1ftvep4"
style="--depth: 1;"
>
<div
class="line svelte-1ftvep4 collapsed"
>
<span
aria-roledescription="Line number 2"
class="line-number svelte-1ftvep4"
data-pseudo-content="2"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Expand"
class="toggle svelte-1ftvep4"
data-pseudo-content="▶"
/>
<span
class="key svelte-1ftvep4"
>
"
items
"
</span>
<span
class="punctuation colon svelte-1ftvep4"
>
:
</span>
<span
class="punctuation bracket svelte-1ftvep4"
>
{
</span>
<button
class="preview svelte-1ftvep4"
>
Object(1)
</button>
<span
class="punctuation bracket svelte-1ftvep4"
>
}
</span>
</span>
</div>
<div
class="children svelte-1ftvep4 hidden"
>
<div
class="json-node svelte-1ftvep4"
style="--depth: 2;"
>
<div
class="line svelte-1ftvep4"
>
<span
aria-roledescription="Line number 3"
class="line-number svelte-1ftvep4"
data-pseudo-content="3"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Collapse"
class="toggle svelte-1ftvep4"
data-pseudo-content="▼"
/>
<span
class="key svelte-1ftvep4"
>
"
item
"
</span>
<span
class="punctuation colon svelte-1ftvep4"
>
:
</span>
<span
class="punctuation bracket svelte-1ftvep4 square-bracket"
>
[
</span>
</span>
</div>
<div
class="children svelte-1ftvep4"
>
<div
class="json-node svelte-1ftvep4"
style="--depth: 3;"
>
<div
class="line svelte-1ftvep4 collapsed"
>
<span
aria-roledescription="Line number 4"
class="line-number svelte-1ftvep4"
data-pseudo-content="4"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Expand"
class="toggle svelte-1ftvep4"
data-pseudo-content="▶"
/>
<span
class="key svelte-1ftvep4"
>
"
0
"
</span>
<span
class="punctuation colon svelte-1ftvep4"
>
:
</span>
<span
class="punctuation bracket svelte-1ftvep4"
>
{
</span>
<button
class="preview svelte-1ftvep4"
>
Object(6)
</button>
<span
class="punctuation bracket svelte-1ftvep4"
>
}
</span>
</span>
</div>
<div
...View in Storybook
Chrome 1211168x90
Linux Linux Ubuntu 20.04.4
02d91e on json-list
Caught exception in
play functionThis story threw an error after it finished rendering which means interactions may not have been executed fully.
TestingLibraryElementError: Found multiple elements with the text: Object(2)
Here are the matching elements:
Ignored nodes: comments, script, style
<button
class="preview svelte-1ftvep4"
>
Object(2)
</button>
Ignored nodes: comments, script, style
<button
class="preview svelte-1ftvep4"
>
Object(2)
</button>
(If this is intentional, then use the `*AllBy*` variant of the query (like `queryAllByText`, `getAllByText`, or `findAllByText`)).
Ignored nodes: comments, script, style
<div
id="storybook-root"
>
<div
class="block svelte-12cmxck"
data-testid="json"
id=""
style="border-style: solid; overflow: visible; min-width: min(0px, 100%); border-width: var(--block-border-width);"
>
<div
class="wrap default full svelte-au1olv hide"
style="position: absolute; padding: 0px;"
/>
<button
aria-label="Copy"
aria-roledescription="Copy value"
class="copy-text svelte-6fc7le"
title="copy"
>
<svg
color="currentColor"
viewBox="0 0 33 33"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"
fill="currentColor"
/>
<path
d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"
fill="currentColor"
/>
</svg>
</button>
<div
class="json-holder svelte-6fc7le"
>
<div
class="json-node svelte-1ftvep4 root"
style="--depth: 0;"
>
<div
class="line svelte-1ftvep4"
>
<span
aria-roledescription="Line number 1"
class="line-number svelte-1ftvep4"
data-pseudo-content="1"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Collapse"
class="toggle svelte-1ftvep4"
data-pseudo-content="▼"
/>
<span
class="punctuation bracket svelte-1ftvep4"
>
{
</span>
</span>
</div>
<div
class="children svelte-1ftvep4"
>
<div
class="json-node svelte-1ftvep4"
style="--depth: 1;"
>
<div
class="line svelte-1ftvep4 collapsed"
>
<span
aria-roledescription="Line number 2"
class="line-number svelte-1ftvep4"
data-pseudo-content="2"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Expand"
class="toggle svelte-1ftvep4"
data-pseudo-content="▶"
/>
<span
class="key svelte-1ftvep4"
>
"
items
"
</span>
<span
class="punctuation colon svelte-1ftvep4"
>
:
</span>
<span
class="punctuation bracket svelte-1ftvep4"
>
{
</span>
<button
class="preview svelte-1ftvep4"
>
Object(1)
</button>
<span
class="punctuation bracket svelte-1ftvep4"
>
}
</span>
</span>
</div>
<div
class="children svelte-1ftvep4 hidden"
>
<div
class="json-node svelte-1ftvep4"
style="--depth: 2;"
>
<div
class="line svelte-1ftvep4"
>
<span
aria-roledescription="Line number 3"
class="line-number svelte-1ftvep4"
data-pseudo-content="3"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Collapse"
class="toggle svelte-1ftvep4"
data-pseudo-content="▼"
/>
<span
class="key svelte-1ftvep4"
>
"
item
"
</span>
<span
class="punctuation colon svelte-1ftvep4"
>
:
</span>
<span
class="punctuation bracket svelte-1ftvep4 square-bracket"
>
[
</span>
</span>
</div>
<div
class="children svelte-1ftvep4"
>
<div
class="json-node svelte-1ftvep4"
style="--depth: 3;"
>
<div
class="line svelte-1ftvep4 collapsed"
>
<span
aria-roledescription="Line number 4"
class="line-number svelte-1ftvep4"
data-pseudo-content="4"
/>
<span
class="content svelte-1ftvep4"
>
<button
aria-label="Expand"
class="toggle svelte-1ftvep4"
data-pseudo-content="▶"
/>
<span
class="key svelte-1ftvep4"
>
"
0
"
</span>
<span
class="punctuation colon svelte-1ftvep4"
>
:
</span>
<span
class="punctuation bracket svelte-1ftvep4"
>
{
</span>
<button
class="preview svelte-1ftvep4"
>
Object(6)
</button>
<span
class="punctuation bracket svelte-1ftvep4"
>
}
</span>
</span>
</div>
<div
...
at Object.getElementError (https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-C5Sj9x3H.js:117:284)
at Un (https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-C5Sj9x3H.js:131:3483)
at Hn (https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-C5Sj9x3H.js:131:3528)
at https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-C5Sj9x3H.js:133:10
at https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-C5Sj9x3H.js:139:387
at ln.invoke (https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-Bqoxw6Vv.js:27:9266)
at ln.track (https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-Bqoxw6Vv.js:27:6505)
at Object.getByText (https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/index-Bqoxw6Vv.js:27:5777)
at https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/assets/JSON.stories-DaDgw6G9.js:1:2167
at async https://649585a46a67480e3074dc75-zrnrvknesp.capture-loopback.chromatic.com/sb-preview/runtime.js:144:3897