The baseline is taller than the new snapshot (1168x953 to 1168x830).
Fail
Unable to find an element with the text: Results. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<div
data-v-app=""
id="storybook-root"
>
<div
class=""
>
<div
class="vs-carbon-calculator__wrapper"
jsdisabled="false"
>
<div
class="container vs-carbon-calculator"
data-test="vs-carbon-calculator"
>
<div
class="row vs-carbon-calculator__survey vs-carbon-calculator__survey"
>
<div
class="col"
>
<form>
<fieldset>
<div
class="vs-progress-bar vs-progress-bar--stepped"
data-test="vs-progress-bar"
>
<div
class="vs-progress-bar__stepper"
>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="1"
class="progress-bar"
role="progressbar"
style="width: 100%;"
>
</div>
</div>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="0"
class="progress-bar"
role="progressbar"
style="width: 0%;"
>
</div>
</div>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="0"
class="progress-bar"
role="progressbar"
style="width: 0%;"
>
</div>
</div>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="0"
class="progress-bar"
role="progressbar"
style="width: 0%;"
>
</div>
</div>
</div>
<p
class="vs-progress-bar__label"
id="progress-bar-27"
>
Step 1 of 4
</p>
</div>
<div>
<h2
class="vs-heading vs-heading--style-level-3 vs-carbon-calculator__category-heading"
>
Travel to Scotland
</h2>
<fieldset
class="vs-carbon-calculator-question"
data-test="vs-carbon-calculator-question"
id="__BVID__824059___BV___"
tabindex="0"
>
<div
class=""
>
<div
class=""
>
<label
class="vs-carbon-calculator-question__label mb-8"
for="transportModeTo"
>
How are you travelling to Scotland?
</label>
<div
class="vs-radio-button"
data-test="vs-radio-button"
required="true"
>
<div
aria-invalid="false"
class="btn-group-md bv-no-focus-ring"
id="transportModeTo"
role="radiogroup"
tabindex="-1"
>
<div
class="vs-radio-button__option"
>
<div
class="form-check form-check-inline"
>
<input
class="form-check-input"
id="transportModeTonoTravel"
name="transportModeTo"
type="radio"
value="noTravel"
/>
<label
class="form-check-label"
for="transportModeTonoTravel"
>
<span>
I live in Scotland
</span>
</label>
</div>
</div>
<div
class="vs-radio-button__option"
>
<div
class="form-check form-check-inline"
>
<input
class="form-check-input"
id="transportModeTodomesticPlane"
name="transportModeTo"
type="radio"
value="domesticPlane"
/>
<label
...View in Storybook
Chrome 1211168x830
Linux Linux Ubuntu 20.04.4
081f90 on feat/accessibility-audit
Caught exception in
play functionThis story threw an error after it finished rendering which means interactions may not have been executed fully.
Error: Unable to find an element with the text: Results. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<div
data-v-app=""
id="storybook-root"
>
<div
class=""
>
<div
class="vs-carbon-calculator__wrapper"
jsdisabled="false"
>
<div
class="container vs-carbon-calculator"
data-test="vs-carbon-calculator"
>
<div
class="row vs-carbon-calculator__survey vs-carbon-calculator__survey"
>
<div
class="col"
>
<form>
<fieldset>
<div
class="vs-progress-bar vs-progress-bar--stepped"
data-test="vs-progress-bar"
>
<div
class="vs-progress-bar__stepper"
>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="1"
class="progress-bar"
role="progressbar"
style="width: 100%;"
>
</div>
</div>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="0"
class="progress-bar"
role="progressbar"
style="width: 0%;"
>
</div>
</div>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="0"
class="progress-bar"
role="progressbar"
style="width: 0%;"
>
</div>
</div>
<div
class="progress"
>
<div
aria-labelledby="progress-bar-27"
aria-valuemin="0"
aria-valuenow="0"
class="progress-bar"
role="progressbar"
style="width: 0%;"
>
</div>
</div>
</div>
<p
class="vs-progress-bar__label"
id="progress-bar-27"
>
Step 1 of 4
</p>
</div>
<div>
<h2
class="vs-heading vs-heading--style-level-3 vs-carbon-calculator__category-heading"
>
Travel to Scotland
</h2>
<fieldset
class="vs-carbon-calculator-question"
data-test="vs-carbon-calculator-question"
id="__BVID__824059___BV___"
tabindex="0"
>
<div
class=""
>
<div
class=""
>
<label
class="vs-carbon-calculator-question__label mb-8"
for="transportModeTo"
>
How are you travelling to Scotland?
</label>
<div
class="vs-radio-button"
data-test="vs-radio-button"
required="true"
>
<div
aria-invalid="false"
class="btn-group-md bv-no-focus-ring"
id="transportModeTo"
role="radiogroup"
tabindex="-1"
>
<div
class="vs-radio-button__option"
>
<div
class="form-check form-check-inline"
>
<input
class="form-check-input"
id="transportModeTonoTravel"
name="transportModeTo"
type="radio"
value="noTravel"
/>
<label
class="form-check-label"
for="transportModeTonoTravel"
>
<span>
I live in Scotland
</span>
</label>
</div>
</div>
<div
class="vs-radio-button__option"
>
<div
class="form-check form-check-inline"
>
<input
class="form-check-input"
id="transportModeTodomesticPlane"
name="transportModeTo"
type="radio"
value="domesticPlane"
/>
<label
...
at Object.Wa [as waitFor] (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/assets/index-BZBhx-Rf.js:157:3360)
at Cp.invoke (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/assets/index-BZBhx-Rf.js:27:9139)
at Cp.intercept (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/assets/index-BZBhx-Rf.js:27:6668)
at Cp.track (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/assets/index-BZBhx-Rf.js:27:6400)
at waitFor (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/assets/index-BZBhx-Rf.js:27:5672)
at goToResults (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/assets/CarbonCalculator.stories-DUVZzMdh.js:86:4562)
at async https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/sb-preview/runtime.js:129:3588
at async StoryRender.runPhase (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/sb-preview/runtime.js:129:912)
at async StoryRender.render (https://646df3398f07e38a95184dbb-xzrzkzbqzv.capture-loopback.chromatic.com/sb-preview/runtime.js:129:3536)