Skip to content

Commit

Permalink
test: update snaps with styles
Browse files Browse the repository at this point in the history
  • Loading branch information
@mgallagher56
mgallagher56 committed Jan 2, 2025
1 parent 48bb658 commit 18bcf71
Show file tree
Hide file tree
Showing 12 changed files with 247 additions and 109 deletions.
60 changes: 30 additions & 30 deletions apps/web/app/components/accounts/__snapshots__/AccountDetails.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ exports[`<AccountDetails /> > should remove year when delete button is clicked 1
</button>
</div>
<div
class="d_flex flex_row gap_5"
class="d_flex flex-d_row gap_5"
>
<div>
<p
Expand Down Expand Up @@ -184,7 +184,7 @@ exports[`<AccountDetails /> > should remove year when delete button is clicked 1
</button>
</div>
<div
class="d_flex flex_row gap_5"
class="d_flex flex-d_row gap_5"
>
<div>
<p
Expand Down Expand Up @@ -356,7 +356,7 @@ exports[`<AccountDetails /> > should render 1`] = `
</button>
</div>
<div
class="d_flex flex_row gap_5"
class="d_flex flex-d_row gap_5"
>
<div>
<p
Expand Down Expand Up @@ -519,7 +519,7 @@ exports[`<AccountDetails /> > should render 1`] = `
</button>
</div>
<div
class="d_flex flex_row gap_5"
class="d_flex flex-d_row gap_5"
>
<div>
<p
Expand Down Expand Up @@ -691,7 +691,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
</button>
</div>
<div
class="d_flex flex_row gap_5"
class="d_flex flex-d_row gap_5"
>
<div>
<p
Expand All @@ -700,7 +700,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
January
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-January"
Expand Down Expand Up @@ -733,7 +733,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
February
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-February"
Expand Down Expand Up @@ -766,7 +766,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
March
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-March"
Expand Down Expand Up @@ -799,7 +799,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
April
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-April"
Expand Down Expand Up @@ -832,7 +832,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
May
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-May"
Expand Down Expand Up @@ -865,7 +865,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
June
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-June"
Expand Down Expand Up @@ -898,7 +898,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
July
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-July"
Expand Down Expand Up @@ -931,7 +931,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
August
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-August"
Expand Down Expand Up @@ -964,7 +964,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
September
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-September"
Expand Down Expand Up @@ -997,7 +997,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
October
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-October"
Expand Down Expand Up @@ -1030,7 +1030,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
November
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-November"
Expand Down Expand Up @@ -1063,7 +1063,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
December
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2021-December"
Expand Down Expand Up @@ -1106,7 +1106,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
</button>
</div>
<div
class="d_flex flex_row gap_5"
class="d_flex flex-d_row gap_5"
>
<div>
<p
Expand All @@ -1115,7 +1115,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
January
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-January"
Expand Down Expand Up @@ -1148,7 +1148,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
February
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-February"
Expand Down Expand Up @@ -1181,7 +1181,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
March
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-March"
Expand Down Expand Up @@ -1214,7 +1214,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
April
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-April"
Expand Down Expand Up @@ -1247,7 +1247,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
May
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-May"
Expand Down Expand Up @@ -1280,7 +1280,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
June
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-June"
Expand Down Expand Up @@ -1313,7 +1313,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
July
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-July"
Expand Down Expand Up @@ -1346,7 +1346,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
August
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-August"
Expand Down Expand Up @@ -1379,7 +1379,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
September
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-September"
Expand Down Expand Up @@ -1412,7 +1412,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
October
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-October"
Expand Down Expand Up @@ -1445,7 +1445,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
November
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-November"
Expand Down Expand Up @@ -1478,7 +1478,7 @@ exports[`<AccountDetails /> > should render in edit mode 1`] = `
December
</p>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="2023-December"
Expand Down
4 changes: 2 additions & 2 deletions apps/web/app/components/core/cards/__snapshots__/AccountsCard.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ exports[`<AccountsCard /> > it renders an AccountsCard component with title as e
<body>
<div>
<div
class="chakra-card pos_relative transition_all_0.3s_ease-in-out border_1px_solid_token(colors.gray.500)! [&:hover]:shadow_2px_5px_8px_0px_token(colors.gray.500)! [&:hover]:transform_translate3d(-2px,_-5px,_-5px) [&:hover]:cursor_pointer css-kt1dpu"
class="chakra-card pos_relative trs_all_0.3s_ease-in-out bd_1px_solid_token(colors.gray.500)! [&:hover]:bx-sh_2px_5px_8px_0px_token(colors.gray.500)! [&:hover]:trf_translate3d(-2px,_-5px,_-5px) [&:hover]:cursor_pointer css-kt1dpu"
id="123456"
title="My curent account"
>
Expand Down Expand Up @@ -139,7 +139,7 @@ exports[`<AccountsCard with increasing values > it calls supabase.delete when de
<body>
<div>
<div
class="chakra-card pos_relative transition_all_0.3s_ease-in-out border_1px_solid_token(colors.gray.500)! [&:hover]:shadow_2px_5px_8px_0px_token(colors.gray.500)! [&:hover]:transform_translate3d(-2px,_-5px,_-5px) [&:hover]:cursor_pointer css-kt1dpu"
class="chakra-card pos_relative trs_all_0.3s_ease-in-out bd_1px_solid_token(colors.gray.500)! [&:hover]:bx-sh_2px_5px_8px_0px_token(colors.gray.500)! [&:hover]:trf_translate3d(-2px,_-5px,_-5px) [&:hover]:cursor_pointer css-kt1dpu"
id="123456"
title="My curent account"
>
Expand Down
2 changes: 1 addition & 1 deletion apps/web/app/components/core/cards/__snapshots__/FLPCard.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

exports[`<FlpCard /> > it renders a ChakraUI Card component with title as expected 1`] = `
<div
class="chakra-card pos_relative transition_all_0.3s_ease-in-out border_1px_solid_token(colors.gray.500)! [&:hover]:shadow_2px_5px_8px_0px_token(colors.gray.500)! [&:hover]:transform_translate3d(-2px,_-5px,_-5px) [&:hover]:cursor_pointer css-2dlz7"
class="chakra-card pos_relative trs_all_0.3s_ease-in-out bd_1px_solid_token(colors.gray.500)! [&:hover]:bx-sh_2px_5px_8px_0px_token(colors.gray.500)! [&:hover]:trf_translate3d(-2px,_-5px,_-5px) [&:hover]:cursor_pointer css-2dlz7"
title="FLPCard"
/>
`;
16 changes: 8 additions & 8 deletions apps/web/app/components/core/inputs/input/__snapshots__/FLPInput.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`<FLPInput /> > should render as expected 1`] = `
<div>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="Test"
Expand All @@ -27,7 +27,7 @@ exports[`<FLPInput /> > should render as expected 1`] = `
exports[`<FLPInput /> > should render as expected with error 1`] = `
<div>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="Test"
Expand All @@ -43,7 +43,7 @@ exports[`<FLPInput /> > should render as expected with error 1`] = `
id="Test"
/>
<span
class="text_red.500 fw_bold"
class="c_red.500 fw_bold"
>
Error
</span>
Expand All @@ -56,7 +56,7 @@ exports[`<FLPInput /> > should render as expected with error 1`] = `
exports[`<FLPInput /> > should render as expected with value 1`] = `
<div>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="Test"
Expand All @@ -81,7 +81,7 @@ exports[`<FLPInput /> > should render as expected with value 1`] = `
exports[`<FLPInput /> > should render as expected with value and error 1`] = `
<div>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="Test"
Expand All @@ -98,7 +98,7 @@ exports[`<FLPInput /> > should render as expected with value and error 1`] = `
value="Value"
/>
<span
class="text_red.500 fw_bold"
class="c_red.500 fw_bold"
>
Error
</span>
Expand All @@ -111,7 +111,7 @@ exports[`<FLPInput /> > should render as expected with value and error 1`] = `
exports[`<FLPInput /> > should render as expected without a label 1`] = `
<div>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="Test"
Expand All @@ -136,7 +136,7 @@ exports[`<FLPInput /> > should render as expected without a label 1`] = `
exports[`<FLPInput /> > should render elements as a row 1`] = `
<div>
<div
class="d_flex flex_row items_center gap_4"
class="d_flex flex-d_row ai_center gap_4"
>
<label
for="Test"
Expand Down
4 changes: 2 additions & 2 deletions apps/web/app/components/core/inputs/select/__snapshots__/FLPSelect.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ exports[`<FLPSelect /> > should render as expected 1`] = `
<body>
<div>
<div
class="d_flex flex_column gap_2"
class="d_flex flex-d_column gap_2"
>
<label
for="label"
Expand Down Expand Up @@ -61,7 +61,7 @@ exports[`<FLPSelect /> > should render as expected as row 1`] = `
<body>
<div>
<div
class="d_flex flex_row items_center gap_4"
class="d_flex flex-d_row ai_center gap_4"
>
<label
for="label"
Expand Down
2 changes: 1 addition & 1 deletion ...omponents/dialogs/addEditAccountsDialog.tsx/__snapshots__/AddAccountsDialog.test.tsx.snap
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`<AddAccountDialogBtn > should render add account dialog when trigger button is clicked 1`] = `"<body><div><button type="button" class="chakra-button css-1ltlu47">addAccount</button></div><div class="chakra-portal"><div class="chakra-modal__overlay css-13d1tkw" ></div><div data-focus-guard="true" tabindex="0" ></div><div data-focus-lock-disabled="false"><div class="chakra-modal__content-container css-1oxhx2p" tabindex="-1"><section class="chakra-modal__content css-6yiygt" role="dialog" id="chakra-modal-:r0:" tabindex="-1" aria-modal="true" aria-labelledby="chakra-modal--header-:r0:" aria-describedby="chakra-modal--body-:r0:"><header class="chakra-modal__header css-72fd9l" id="chakra-modal--header-:r0:">addAccount</header><button type="button" aria-label="Close" class="chakra-modal__close-btn css-6sdaxy"><svg viewBox="0 0 24 24" focusable="false" class="chakra-icon css-onkibi" aria-hidden="true"><path fill="currentColor" d="M.439,21.44a1.5,1.5,0,0,0,2.122,2.121L11.823,14.3a.25.25,0,0,1,.354,0l9.262,9.263a1.5,1.5,0,1,0,2.122-2.121L14.3,12.177a.25.25,0,0,1,0-.354l9.263-9.262A1.5,1.5,0,0,0,21.439.44L12.177,9.7a.25.25,0,0,1-.354,0L2.561.44A1.5,1.5,0,0,0,.439,2.561L9.7,11.823a.25.25,0,0,1,0,.354Z"></path></svg></button><div class="chakra-modal__body css-0" id="chakra-modal--body-:r0:"><form><div class="css-1kkt86i"><div class="d_flex flex_column gap_2"><label for="Name">Name</label><div><div class="css-3a3hw0"><input placeholder="accountName" id="Name" class="chakra-input css-0" name="name" value="Starling"></div></div></div><div class="d_flex flex_column gap_2"><label for="Account Type">Account Type</label><div class="chakra-select__wrapper css-42b2qy"><select name="type" id="Account Type" class="chakra-select css-1ik61og"><option value="Current">Current</option><option value="Saving">Saving</option><option value="Mortgage">Mortgage</option><option value="Loan">Loan</option><option value="Owed">Owed</option></select><div class="chakra-select__icon-wrapper css-162mkon"><svg viewBox="0 0 24 24" role="presentation" class="chakra-select__icon" focusable="false" aria-hidden="true" ><path fill="currentColor" d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"></path></svg></div></div></div></div></form></div><footer class="chakra-modal__footer css-192qrng"><div role="group" class="chakra-button__group css-1ind3v2" data-orientation="horizontal"><button type="button" class="chakra-button css-kn8t1u">close</button><button type="submit" class="chakra-button css-kn8t1u" form="123456">addAccount</button></div></footer></section></div></div><div data-focus-guard="true" tabindex="0" ></div></div></body>"`;
exports[`<AddAccountDialogBtn > should render add account dialog when trigger button is clicked 1`] = `"<body><div><button type="button" class="chakra-button css-1ltlu47">addAccount</button></div><div class="chakra-portal"><div class="chakra-modal__overlay css-13d1tkw" ></div><div data-focus-guard="true" tabindex="0" ></div><div data-focus-lock-disabled="false"><div class="chakra-modal__content-container css-1oxhx2p" tabindex="-1"><section class="chakra-modal__content css-6yiygt" role="dialog" id="chakra-modal-:r0:" tabindex="-1" aria-modal="true" aria-labelledby="chakra-modal--header-:r0:" aria-describedby="chakra-modal--body-:r0:"><header class="chakra-modal__header css-72fd9l" id="chakra-modal--header-:r0:">addAccount</header><button type="button" aria-label="Close" class="chakra-modal__close-btn css-6sdaxy"><svg viewBox="0 0 24 24" focusable="false" class="chakra-icon css-onkibi" aria-hidden="true"><path fill="currentColor" d="M.439,21.44a1.5,1.5,0,0,0,2.122,2.121L11.823,14.3a.25.25,0,0,1,.354,0l9.262,9.263a1.5,1.5,0,1,0,2.122-2.121L14.3,12.177a.25.25,0,0,1,0-.354l9.263-9.262A1.5,1.5,0,0,0,21.439.44L12.177,9.7a.25.25,0,0,1-.354,0L2.561.44A1.5,1.5,0,0,0,.439,2.561L9.7,11.823a.25.25,0,0,1,0,.354Z"></path></svg></button><div class="chakra-modal__body css-0" id="chakra-modal--body-:r0:"><form><div class="css-1kkt86i"><div class="d_flex flex-d_column gap_2"><label for="Name">Name</label><div><div class="css-3a3hw0"><input placeholder="accountName" id="Name" class="chakra-input css-0" name="name" value="Starling"></div></div></div><div class="d_flex flex-d_column gap_2"><label for="Account Type">Account Type</label><div class="chakra-select__wrapper css-42b2qy"><select name="type" id="Account Type" class="chakra-select css-1ik61og"><option value="Current">Current</option><option value="Saving">Saving</option><option value="Mortgage">Mortgage</option><option value="Loan">Loan</option><option value="Owed">Owed</option></select><div class="chakra-select__icon-wrapper css-162mkon"><svg viewBox="0 0 24 24" role="presentation" class="chakra-select__icon" focusable="false" aria-hidden="true" ><path fill="currentColor" d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"></path></svg></div></div></div></div></form></div><footer class="chakra-modal__footer css-192qrng"><div role="group" class="chakra-button__group css-1ind3v2" data-orientation="horizontal"><button type="button" class="chakra-button css-kn8t1u">close</button><button type="submit" class="chakra-button css-kn8t1u" form="123456">addAccount</button></div></footer></section></div></div><div data-focus-guard="true" tabindex="0" ></div></div></body>"`;
Loading

0 comments on commit 18bcf71

Please sign in to comment.