Skip to content

Commit 0cda745

Browse files
codediodeiocodediodeio
committed
test: add tests for core features
1 parent 0bca77c commit 0cda745

22 files changed

+218
-136
lines changed

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -9,3 +9,4 @@ node_modules
99
vite.config.js.timestamp-*
1010
vite.config.ts.timestamp-*
1111
package
12+
/test-results

‎dist/components/SignedIn.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,5 @@ const user = userStore();
66
</script>
77

88
{#if $user}
9-
<slot user={$user} signOut={() => signOut(auth)} />
9+
<slot user={$user} {auth} signOut={() => signOut(auth)} />
1010
{/if}

‎dist/components/SignedIn.svelte.d.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { SvelteComponent } from "svelte";
2-
import { signOut, type User } from "firebase/auth";
2+
import { signOut, type User, type Auth } from "firebase/auth";
33
declare const __propDef: {
44
props: Record<string, never>;
55
events: {
@@ -8,6 +8,7 @@ declare const __propDef: {
88
slots: {
99
default: {
1010
user: User;
11+
auth: Auth;
1112
signOut: () => Promise<void>;
1213
};
1314
};

‎dist/components/SignedOut.svelte

+5-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
1-
<script>import { userStore } from "../stores/auth.js";
1+
<script>import { getFirebaseContext } from "../stores/sdk.js";
2+
import { userStore } from "../stores/auth.js";
3+
getFirebaseContext;
4+
const auth = getFirebaseContext().auth;
25
const user = userStore();
36
</script>
47

58
{#if !$user}
6-
<slot />
9+
<slot {auth} />
710
{/if}

‎dist/components/SignedOut.svelte.d.ts

+4-1
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,14 @@
11
import { SvelteComponent } from "svelte";
2+
import type { Auth } from 'firebase/auth';
23
declare const __propDef: {
34
props: Record<string, never>;
45
events: {
56
[evt: string]: CustomEvent<any>;
67
};
78
slots: {
8-
default: {};
9+
default: {
10+
auth: Auth;
11+
};
912
};
1013
};
1114
export type SignedOutProps = typeof __propDef.props;

‎dist/index.d.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -7,4 +7,5 @@ import SignedIn from './components/SignedIn.svelte';
77
import { docStore } from './stores/firestore.js';
88
import { collectionStore } from './stores/firestore.js';
99
import { userStore } from './stores/auth.js';
10-
export { Doc, User, Collection, FirebaseApp, SignedOut, SignedIn, docStore, collectionStore, userStore };
10+
import { getFirebaseContext } from './stores/sdk.js';
11+
export { Doc, User, Collection, FirebaseApp, SignedOut, SignedIn, docStore, collectionStore, userStore, getFirebaseContext };

‎dist/index.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import Doc from './components/Doc.svelte';
55
import FirebaseApp from './components/FirebaseApp.svelte';
66
import SignedIn from './components/SignedIn.svelte';
77
import SignedOut from './components/SignedOut.svelte';
8-
// import { docStore, collectionStore } from './stores/stores.js';
98
import { userStore } from './stores/auth.js';
109
import { docStore, collectionStore } from './stores/firestore.js';
11-
10+
import { getFirebaseContext } from './stores/sdk.js';
11+
1212
export {
1313
Doc,
1414
User,
@@ -18,5 +18,6 @@ export {
1818
SignedIn,
1919
docStore,
2020
collectionStore,
21-
userStore
21+
userStore,
22+
getFirebaseContext
2223
}

‎dist/stores/firestore.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ export function collectionStore(ref, startWith = []) {
8686
/**
8787
* experimental, fetch document based on curret user
8888
*/
89-
export function userDataStore(collectionPath = 'users') {
89+
export function userDataStore(collectionPath = "users") {
9090
const user = userStore();
9191
return derived(user, ($user, set) => {
9292
if (!$user)

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
"preview": "vite preview",
88
"package": "svelte-kit sync && svelte-package && publint",
99
"prepublishOnly": "npm run package",
10-
"test": "playwright test",
10+
"test": "playwright test --ui",
1111
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
1212
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
1313
"lint": "eslint ."

‎src/lib/components/SignedIn.svelte

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
<script lang="ts">
22
import { userStore } from "$lib/stores/auth.js";
33
import { getFirebaseContext } from "$lib/stores/sdk.js";
4-
import { signOut, type User } from "firebase/auth";
5-
6-
interface $$Slots {
7-
default: { user: User, signOut: () => Promise<void> }
8-
}
4+
import { signOut, type User, type Auth } from "firebase/auth";
95
106
const auth = getFirebaseContext().auth!;
117
const user = userStore()
128
9+
interface $$Slots {
10+
default: { user: User, auth: Auth, signOut: () => Promise<void> }
11+
}
12+
1313
</script>
1414

1515
{#if $user}
16-
<slot user={$user} signOut={() => signOut(auth)} />
16+
<slot user={$user} {auth} signOut={() => signOut(auth)} />
1717
{/if}

‎src/lib/components/SignedOut.svelte

+10-1
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,17 @@
11
<script lang="ts">
2+
import { getFirebaseContext } from "$lib/stores/sdk.js";
23
import { userStore } from "$lib/stores/auth.js";
4+
import type { Auth, User } from 'firebase/auth';
5+
getFirebaseContext
6+
const auth = getFirebaseContext().auth!;
37
const user = userStore()
8+
9+
interface $$Slots {
10+
default: { auth: Auth }
11+
}
12+
413
</script>
514

615
{#if !$user}
7-
<slot />
16+
<slot {auth} />
817
{/if}

‎src/lib/index.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import Doc from './components/Doc.svelte';
55
import FirebaseApp from './components/FirebaseApp.svelte';
66
import SignedIn from './components/SignedIn.svelte';
77
import SignedOut from './components/SignedOut.svelte';
8-
// import { docStore, collectionStore } from './stores/stores.js';
98
import { userStore } from './stores/auth.js';
109
import { docStore, collectionStore } from './stores/firestore.js';
11-
10+
import { getFirebaseContext } from './stores/sdk.js';
11+
1212
export {
1313
Doc,
1414
User,
@@ -18,5 +18,6 @@ export {
1818
SignedIn,
1919
docStore,
2020
collectionStore,
21-
userStore
21+
userStore,
22+
getFirebaseContext
2223
}

‎src/lib/stores/firestore.ts

+9-10
Original file line numberDiff line numberDiff line change
@@ -132,14 +132,13 @@ export function collectionStore<T>(
132132
/**
133133
* experimental, fetch document based on curret user
134134
*/
135-
export function userDataStore<T = DocumentData>(collectionPath = 'users'): Readable<T | null> {
136-
const user = userStore();
137-
return derived(user, ($user, set) => {
138-
if (!$user) return set(null);
139-
const fullPath = `${collectionPath}/${$user.uid}`;
140-
return docStore<T>(fullPath).subscribe(set);
141-
});
135+
export function userDataStore<T = DocumentData>(
136+
collectionPath = "users"
137+
): Readable<T | null> {
138+
const user = userStore();
139+
return derived(user, ($user, set) => {
140+
if (!$user) return set(null);
141+
const fullPath = `${collectionPath}/${$user.uid}`;
142+
return docStore<T>(fullPath).subscribe(set);
143+
});
142144
}
143-
144-
145-

‎src/routes/+page.svelte

+11-99
Original file line numberDiff line numberDiff line change
@@ -1,107 +1,19 @@
11
<script lang="ts">
2-
import Doc from '$lib/components/Doc.svelte';
3-
// import { collectionStore, docStore, userStore } from '$lib/stores';
4-
import User from '$lib/components/User.svelte';
5-
import { db as firestore, auth } from './firebase.js';
6-
import { signInAnonymously, signOut } from "firebase/auth";
7-
import { addDoc, collection, Firestore, orderBy, query, refEqual, where } from 'firebase/firestore';
8-
import Collection from '$lib/components/Collection.svelte';
9-
import FirebaseApp from '$lib/components/FirebaseApp.svelte';
10-
import SignedIn from '$lib/components/SignedIn.svelte';
11-
import SignedOut from '$lib/components/SignedOut.svelte';
12-
import { collectionStore, docStore, userDataStore } from '$lib/stores/firestore.js';
13-
import { userStore } from '$lib/stores/auth.js';
2+
import { getFirebaseContext } from "$lib/stores/sdk.js";
143
15-
async function addPost(uid:string) {
16-
const posts = collection(firestore, `users/${uid}/posts`);
17-
await addDoc(posts, {
18-
content: (Math.random() + 1).toString(36).substring(7),
19-
created: Date.now(),
20-
});
21-
}
22-
23-
$: makeQuery = (uid:string) => {
24-
const q = query(collection(firestore, `users/${uid}/posts`), orderBy('created', 'desc'));
25-
return q;
26-
}
27-
28-
// const userData = userDataStore<any>();
29-
// const userQuery= userQueryStore('posts');
30-
31-
const myUser = userStore();
32-
const userData = docStore<{ name: string }>('users/Toy8wnsp9AMLdxtP8cR7idM8J263');
33-
const users = collectionStore<any>('users');
344
5+
const ctx = getFirebaseContext();
356
367
</script>
378

389
<h1>Welcome to SvelteFire</h1>
3910

40-
<SignedIn let:user let:signOut>
41-
<p>Hi {user.displayName}</p>
42-
<button on:click={signOut}>Sign Out</button>
43-
</SignedIn>
44-
45-
<SignedOut>
46-
<button on:click={() => signInAnonymously(auth)}>Sign in</button>
47-
</SignedOut>
48-
49-
50-
51-
<Doc ref="posts/first-post" startWith={{ content: 'sup'}} let:data={post}>
52-
<p>{post?.content}</p>
53-
<div slot="loading">
54-
<p>Loading...</p>
55-
</div>
56-
</Doc>
57-
58-
<User let:user>
59-
60-
<p>Hello {user?.uid}</p>
61-
62-
<Doc ref="posts/first-post" let:data={post}>
63-
<p>{post?.content}</p>
64-
<div slot="loading">
65-
<p>Loading...</p>
66-
</div>
67-
</Doc>
68-
69-
<h1>Your Posts</h1>
70-
71-
<Collection ref={makeQuery(user.uid)} startWith={[]} let:data={posts} let:count>
72-
73-
<p>You've made {count} posts</p>
74-
75-
<ul>
76-
{#each posts as post (post.id)}
77-
<li>{post?.content} ... { post.id }</li>
78-
{/each}
79-
</ul>
80-
81-
<button on:click={() => addPost(user.uid)}>Add Post</button>
82-
</Collection>
83-
84-
85-
<div slot="signedOut">
86-
<p>Sign in to do stuff</p>
87-
<button on:click={() => signInAnonymously(auth)}>Sign in</button>
88-
</div>
89-
</User>
90-
91-
<p>
92-
<a href="/ssr">SSR Test</a>
93-
</p>
94-
95-
<h1>User Query</h1>
96-
97-
{$myUser?.uid}
98-
99-
<!-- {#each $userQuery as post (post.id)}
100-
<li>{post?.content} ... { post.id }</li>
101-
{/each} -->
102-
103-
{$userData?.name}
104-
105-
{#each $users as user (user.id)}
106-
<li>{user?.name} ... { user.id }</li>
107-
{/each}
11+
<ul>
12+
<li><a href="/auth-test">Auth Test</a></li>
13+
<li><a href="/firestore-test">Firestore Test</a></li>
14+
<li><a href="/ssr-test">SSR Test</a></li>
15+
</ul>
16+
<ul>
17+
<li data-testid="auth">Auth Context: {!!ctx.auth}</li>
18+
<li data-testid="firestore">Firestore Context: {!!ctx.firestore}</li>
19+
</ul>

‎src/routes/auth-test/+page.svelte

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<script lang="ts">
2+
import SignedIn from '$lib/components/SignedIn.svelte';
3+
import SignedOut from '$lib/components/SignedOut.svelte';
4+
import { signInAnonymously } from "firebase/auth";
5+
6+
7+
</script>
8+
9+
<h1>Auth Test</h1>
10+
11+
<SignedIn let:user let:signOut>
12+
<h2>Signed In</h2>
13+
<p>Hello {user.uid}</p>
14+
<button on:click={signOut}>Sign Out</button>
15+
</SignedIn>
16+
17+
<SignedOut let:auth>
18+
<h2>Signed Out</h2>
19+
<button on:click={() => signInAnonymously(auth)}>Sign In</button>
20+
</SignedOut>

0 commit comments

Comments
 (0)