Skip to content

Commit 84d3524

Browse files
shinokadashinokada
committed
tests: page tests
1 parent 3e10189 commit 84d3524

File tree

13 files changed

+209
-13
lines changed

13 files changed

+209
-13
lines changed

‎e2e/demo.test.ts

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎e2e/pages.test.ts

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
import { expect, test } from '@playwright/test';
2+
3+
test('home page has expected h1', async ({ page }) => {
4+
await page.goto('/');
5+
expect(await page.textContent("h1")).toBe("Dashboard");
6+
});
7+
8+
test('dashboard page has expected h1', async ({ page }) => {
9+
await page.goto('/dashboard');
10+
expect(await page.textContent("h1")).toBe("Dashboard");
11+
});
12+
13+
test('Pricing page has expected h1', async ({ page }) => {
14+
await page.goto('/pages/pricing');
15+
expect(await page.textContent("h1")).toBe("Our pricing plan made simple");
16+
});
17+
18+
test('Layouts: Stacked page has expected h1', async ({ page }) => {
19+
await page.goto('/layouts/stacked');
20+
expect(await page.textContent("h1")).toBe("Layouts: Stacked");
21+
});
22+
23+
test('Layouts: Sidebar page has expected h1', async ({ page }) => {
24+
await page.goto('/layouts/sidebar');
25+
expect(await page.textContent("h1")).toBe("Layouts: Sidebar");
26+
});
27+
28+
test('Crud: Products page has expected h1', async ({ page }) => {
29+
await page.goto('/crud/products');
30+
expect(await page.textContent("h1")).toBe("CRUD: Products");
31+
});
32+
33+
test('Crud: Users page has expected h1', async ({ page }) => {
34+
await page.goto('/crud/users');
35+
expect(await page.textContent("h1")).toBe("CRUD: Users");
36+
});
37+
38+
test('Settings page has expected h1', async ({ page }) => {
39+
await page.goto('/settings');
40+
expect(await page.textContent("h1")).toBe("User settings");
41+
});
42+
43+
test('Error 400, Maintenance page has expected h1', async ({ page }) => {
44+
await page.goto('/errors/400');
45+
expect(await page.textContent("h1")).toBe("Under Maintenance");
46+
});
47+
48+
test('Error 404, Page not found page has expected h1', async ({ page }) => {
49+
await page.goto('/errors/404');
50+
expect(await page.textContent("h1")).toBe("Page not found");
51+
});
52+
53+
test('Error 500 page has expected h1', async ({ page }) => {
54+
await page.goto('/errors/500');
55+
expect(await page.textContent("h1")).toBe("Something has gone seriously wrong");
56+
});
57+
58+
test('Sign-in page has expected h1', async ({ page }) => {
59+
await page.goto('/authentication/sign-in');
60+
expect(await page.textContent("h1")).toBe("Sign in to platform");
61+
});
62+
63+
test('Sign-up page has expected h1', async ({ page }) => {
64+
await page.goto('/authentication/sign-up');
65+
expect(await page.textContent("h1")).toBe("Create a Free Account");
66+
});
67+
68+
test('forgot-password page has expected h1', async ({ page }) => {
69+
await page.goto('/authentication/forgot-password');
70+
expect(await page.textContent("h1")).toBe("Forgot your password?");
71+
});
72+
73+
test('reset-password page has expected h1', async ({ page }) => {
74+
await page.goto('/authentication/reset-password');
75+
expect(await page.textContent("h1")).toBe("Reset your password");
76+
});
77+
78+
test('profile-lock page has expected h1', async ({ page }) => {
79+
await page.goto('/authentication/profile-lock');
80+
expect(await page.textContent("h1")).toBe("Neil Sims");
81+
});
82+
83+
test('playground/stacked page has expected h1', async ({ page }) => {
84+
await page.goto('/playground/stacked');
85+
expect(await page.textContent("h1")).toBe("Create something awesome here");
86+
});
87+
88+
test('playground/sidebar page has expected h1', async ({ page }) => {
89+
await page.goto('/playground/sidebar');
90+
expect(await page.textContent("h1")).toBe("Create something awesome here");
91+
});
92+
93+
test('About page has expected h1', async ({ page }) => {
94+
await page.goto('/about');
95+
expect(await page.textContent("h1")).toBe("Flowbite Svelte Admin Dashboard");
96+
});

‎src/lib/ForgotPassword.svelte

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
<script lang="ts">
2+
import { Button, Card, P } from 'flowbite-svelte';
3+
import { twMerge } from 'tailwind-merge';
4+
import type { ForgotPasswordProps } from './types';
5+
6+
let {
7+
children,
8+
title = 'Forgot your password?',
9+
site = {
10+
name: 'Flowbite',
11+
img: '/images/flowbite-svelte-icon-logo.svg',
12+
link: '/',
13+
imgAlt: 'FlowBite Logo'
14+
},
15+
btnTitle = 'Reset password',
16+
pageDescription = "Don't fret! Just type in your email and we will send you a code to reset your password!",
17+
mainClass = 'bg-gray-50 dark:bg-gray-900',
18+
mainDivClass,
19+
siteLinkClass,
20+
siteImgClass = 'mr-4 h-11',
21+
cardH1Class,
22+
...restProps
23+
}: ForgotPasswordProps = $props();
24+
25+
const mainDivCls = twMerge('flex flex-col items-center justify-center px-6 pt-8 mx-auto md:h-screen pt:mt-0 dark:bg-gray-900', mainDivClass)
26+
const siteLinkCls = twMerge('flex items-center justify-center mb-8 text-2xl font-semibold lg:mb-10 dark:text-white', siteLinkClass)
27+
const cardH1Cls = twMerge('mb-3 text-2xl font-bold text-gray-900 dark:text-white', cardH1Class)
28+
</script>
29+
30+
<main class={mainClass}>
31+
<div class={mainDivCls}>
32+
{#if site}
33+
<a href={site.link} class={siteLinkCls}>
34+
<img src={site.img} class={siteImgClass} alt={site.imgAlt} />
35+
<span>{site.name}</span>
36+
</a>
37+
{/if}
38+
<!-- Card -->
39+
<Card class="w-full max-w-md p-4 sm:p-6">
40+
<h1 class={cardH1Cls}>{title}</h1>
41+
<P class="text-base font-normal text-gray-500 dark:text-gray-300">
42+
{pageDescription}
43+
</P>
44+
<form class="mt-8 space-y-6" {...restProps}>
45+
{@render children()}
46+
<Button type="submit" size="lg">{btnTitle}</Button>
47+
</form>
48+
</Card>
49+
</div>
50+
</main>
51+
52+
<!--
53+
@component
54+
[Go to docs](https://flowbite-svelte-admin-dashboard.vercel.app/)
55+
## Props
56+
@prop export let title = 'Forgot your password?';
57+
@prop export let site = {
58+
name: 'Flowbite',
59+
img: '/images/flowbite-svelte-icon-logo.svg',
60+
link: '/',
61+
imgAlt: 'FlowBite Logo'
62+
};
63+
@prop export let btnTitle = 'Reset password';
64+
@prop export let pageDescription =
65+
"Don't fret! Just type in your email and we will send you a code to reset your password!";
66+
@prop export let mainClass = 'bg-gray-50 dark:bg-gray-900';
67+
@prop export let mainDivClass =
68+
'flex flex-col items-center justify-center px-6 pt-8 mx-auto md:h-screen pt:mt-0 dark:bg-gray-900';
69+
@prop export let siteLinkClass =
70+
'flex items-center justify-center mb-8 text-2xl font-semibold lg:mb-10 dark:text-white';
71+
@prop export let siteImgClass = 'mr-4 h-11';
72+
@prop export let cardH1Class = 'mb-3 text-2xl font-bold text-gray-900 dark:text-white';
73+
-->

‎src/lib/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ export { default as AppsMenu } from './AppsMenu.svelte';
22
export { default as Change } from './Change.svelte';
33
export { default as ChartWidget } from './ChartWidget.svelte';
44
export { default as ChatMsg } from './ChatMsg.svelte';
5+
export { default as ForgotPassword } from './ForgotPassword.svelte'
56
export { default as IconAvatar } from './IconAvatar.svelte';
67
export { default as LastRange } from './LastRange.svelte';
78
export { default as More } from './More.svelte';

‎src/lib/types.ts

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import type { Component, Snippet } from 'svelte';
22
import type { SizeType, IndicatorProps } from 'flowbite-svelte';
33
import type { ApexOptions } from 'apexcharts';
4+
import type { HTMLFormAttributes } from 'svelte/elements';
45

56
export type MenuItem = {
67
name: string;
@@ -138,3 +139,23 @@ export interface UserMenuProps {
138139
menuItems: string[];
139140
children?: Snippet;
140141
}
142+
143+
export interface SiteType {
144+
name: string;
145+
img: string;
146+
link: string;
147+
imgAlt: string;
148+
}
149+
150+
export interface ForgotPasswordProps extends HTMLFormAttributes {
151+
children: Snippet;
152+
title?: string;
153+
site?: SiteType;
154+
btnTitle?: string;
155+
pageDescription?: string;
156+
mainClass?: string;
157+
mainDivClass?: string;
158+
siteLinkClass?: string;
159+
siteImgClass?: string;
160+
cardH1Class?: string;
161+
}

‎src/routes/(no-sidebar)/layouts/stacked/+page.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,5 +14,6 @@
1414
<MetaTag {path} {description} {title} {subtitle} />
1515

1616
<main class="py-4">
17+
<h1 class="hidden">Layouts: Stacked</h1>
1718
<Dashboard {data} />
1819
</main>

‎src/routes/(sidebar)/+page.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,5 +12,6 @@
1212

1313
<MetaTag {path} {description} {title} {subtitle} />
1414
<main class="p-4">
15+
<h1 class="hidden">Dashboard</h1>
1516
<Dashboard {data} />
1617
</main>

‎src/routes/(sidebar)/crud/products/+page.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@
4040
<MetaTag {path} {description} {title} {subtitle} />
4141

4242
<main class="relative h-full w-full overflow-y-auto bg-white dark:bg-gray-800">
43+
<h1 class="hidden">CRUD: Products</h1>
4344
<div class="p-4">
4445
<Breadcrumb class="mb-5">
4546
<BreadcrumbItem home>Home</BreadcrumbItem>

‎src/routes/(sidebar)/crud/users/+page.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@
2424
<MetaTag {path} {description} {title} {subtitle} />
2525

2626
<main class="relative h-full w-full overflow-y-auto bg-white dark:bg-gray-800">
27+
<h1 class="hidden">CRUD: Users</h1>
2728
<div class="p-4">
2829
<Breadcrumb class="mb-5">
2930
<BreadcrumbItem home>Home</BreadcrumbItem>

‎src/routes/(sidebar)/dashboard/+page.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
<MetaTag {path} {description} {title} {subtitle} />
1515

1616
<main class="p-4">
17+
<h1 class="hidden">Dashboard</h1>
1718
<Dashboard {data} />
1819
</main>
1920
<Footer />

‎src/routes/(sidebar)/layouts/sidebar/+page.svelte

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
<MetaTag {path} {description} {title} {subtitle} />
1515

1616
<main class="p-4">
17+
<h1 class="Layouts: Sidebar">Layouts: Sidebar</h1>
1718
<Dashboard {data} />
1819
</main>
1920
<Footer />

‎src/routes/authentication/forgot-password.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script lang="ts">
2-
import ForgotPassword from '../utils/authentication/ForgotPassword.svelte';
2+
import {ForgotPassword} from '$lib';
33
import { Label, Input, Checkbox, A } from 'flowbite-svelte';
44
import MetaTag from '../utils/MetaTag.svelte';
55
const onSubmit = (e: Event) => {

‎src/routes/utils/authentication/ForgotPassword.svelte

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { Button, Card, P } from 'flowbite-svelte';
3+
import { twMerge } from 'tailwind-merge';
34
import type { HTMLFormAttributes } from 'svelte/elements';
45
import type { Snippet } from 'svelte';
56
interface SiteType {
@@ -33,25 +34,29 @@
3334
btnTitle = 'Reset password',
3435
pageDescription = "Don't fret! Just type in your email and we will send you a code to reset your password!",
3536
mainClass = 'bg-gray-50 dark:bg-gray-900',
36-
mainDivClass = 'flex flex-col items-center justify-center px-6 pt-8 mx-auto md:h-screen pt:mt-0 dark:bg-gray-900',
37-
siteLinkClass = 'flex items-center justify-center mb-8 text-2xl font-semibold lg:mb-10 dark:text-white',
37+
mainDivClass,
38+
siteLinkClass,
3839
siteImgClass = 'mr-4 h-11',
39-
cardH1Class = 'mb-3 text-2xl font-bold text-gray-900 dark:text-white',
40+
cardH1Class,
4041
...restProps
4142
}: Props = $props();
43+
44+
const mainDivCls = twMerge('flex flex-col items-center justify-center px-6 pt-8 mx-auto md:h-screen pt:mt-0 dark:bg-gray-900', mainDivClass)
45+
const siteLinkCls = twMerge('flex items-center justify-center mb-8 text-2xl font-semibold lg:mb-10 dark:text-white', siteLinkClass)
46+
const cardH1Cls = twMerge('mb-3 text-2xl font-bold text-gray-900 dark:text-white', cardH1Class)
4247
</script>
4348

4449
<main class={mainClass}>
45-
<div class={mainDivClass}>
50+
<div class={mainDivCls}>
4651
{#if site}
47-
<a href={site.link} class={siteLinkClass}>
52+
<a href={site.link} class={siteLinkCls}>
4853
<img src={site.img} class={siteImgClass} alt={site.imgAlt} />
4954
<span>{site.name}</span>
5055
</a>
5156
{/if}
5257
<!-- Card -->
5358
<Card class="w-full max-w-md p-4 sm:p-6">
54-
<h1 class={cardH1Class}>{title}</h1>
59+
<h1 class={cardH1Cls}>{title}</h1>
5560
<P class="text-base font-normal text-gray-500 dark:text-gray-300">
5661
{pageDescription}
5762
</P>

0 commit comments

Comments
 (0)