Skip to content

Commit

Permalink
fix: a11y heading levels on auth pages
Browse files Browse the repository at this point in the history
  • Loading branch information
mwargan committed Mar 6, 2024
1 parent 1fdc3b4 commit 436f3fe
Show file tree
Hide file tree
Showing 2 changed files with 60 additions and 1 deletion.
59 changes: 59 additions & 0 deletions src/stories/LoginPage.stories.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import type { Meta, StoryObj } from "@storybook/vue3";
import LoginOrRegisterView from "@/views/Auth/LoginOrRegisterView.vue";
import { useUserStore } from "@/stores/user";
// Import the user fixture json data
import userFixture from "../../cypress/fixtures/user.json";
import { userEvent, within } from "@storybook/test";

const meta: Meta<typeof LoginOrRegisterView> = {
title: "Page/LoginOrRegister",
component: LoginOrRegisterView,
render: () => ({
components: { LoginOrRegisterView },
template: "<loginOrRegisterView />",
}),
parameters: {
// More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
layout: "fullscreen",
},
// This component will have an automatically generated docsPage entry: https://storybook.js.org/docs/writing-docs/autodocs
tags: ["autodocs"],
};

export default meta;
type Story = StoryObj<typeof LoginOrRegisterView>;

// More on interaction testing: https://storybook.js.org/docs/writing-tests/interaction-testing
export const NoUserData: Story = {};

export const WithUserAlreadyAuthenticated: Story = {
/** @todo implement */
render: () => ({
components: { LoginOrRegisterView },
setup() {
const user = useUserStore();
user.isAuthenticated = true;
user.userEmail = userFixture.email;

user.user = {
...userFixture,
seen_at: new Date(),
created_at: new Date(),
updated_at: new Date(),
};
},
template: "<loginOrRegisterView />",
}),
};

export const OnRegisterScreem: Story = {
play: async ({ canvasElement }: any) => {
const canvas = within(canvasElement);
// First we fill the field with the user email
const emailField = canvas.getByPlaceholderText("Email");
await userEvent.type(emailField, userFixture.email);
// Then we click the Submit button
const submitButton = canvas.getByText("Submit");
await userEvent.click(submitButton);
},
};
2 changes: 1 addition & 1 deletion src/views/Auth/LoginOrRegisterView.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ const redirect = () => {

<template>
<h1>{{ $t("Authenticate") }}</h1>
<CardElement :title="$t('Connect')">
<CardElement :titleHeadingLevel="2" :title="$t('Connect')">
<LoginOrRegister @success="redirect" />
</CardElement>
</template>

0 comments on commit 436f3fe

Please sign in to comment.