@strivacity/sdk-vue 3.0.2 → 4.0.0-beta.0

package/testing/tests/composables.spec.ts

@@ -0,0 +1,328 @@
+import type { SDKContext, LoginContext, NativeFlow, NativeFlowState, SessionData } from '../../src/types';
+import { describe, test, expect, vi } from 'vitest';
+import { createApp, defineComponent, h } from 'vue';
+import { FallbackError } from '@strivacity/sdk-core/utils/errors';
+import { STRIVACITY_SDK, useStrivacity, useNativeLoginContext, useNativeLogin } from '../../src/composables';
+import { flushPromises } from '@strivacity/testing/mocks/common';
+import { createMockFlow } from '@strivacity/testing/mocks/sdk';
+import { mount, mountWithNativeLogin } from '../utils/common';
+
+describe('useStrivacity', () => {
+	test('throws when used outside of a Strivacity SDK provider', () => {
+		expect(() => {
+			const app = createApp({
+				setup() {
+					useStrivacity();
+
+					return () => null;
+				},
+			});
+			app.mount(document.createElement('div'));
+		}).toThrow('Missing SDK context');
+	});
+
+	test('returns the context provided by createStrivacitySDK', () => {
+		const sdk = {} as NativeFlow;
+		let ctx: SDKContext<NativeFlow> | undefined;
+
+		mount(sdk, () => {
+			ctx = useStrivacity<NativeFlow>();
+		});
+
+		expect(ctx?.sdk).toBe(sdk);
+	});
+});
+
+describe('useNativeLoginContext', () => {
+	test('throws when used outside of a native login session', () => {
+		expect(() => {
+			const app = createApp({
+				setup() {
+					useNativeLoginContext();
+
+					return () => null;
+				},
+			});
+			app.mount(document.createElement('div'));
+		}).toThrow('Missing SDK native login context');
+	});
+
+	test('resolves to the context provided by an ancestor useNativeLogin call', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		let injected: LoginContext | undefined;
+		let login!: LoginContext;
+
+		const Child = defineComponent({
+			setup() {
+				injected = useNativeLoginContext();
+
+				return () => null;
+			},
+		});
+		const Parent = defineComponent({
+			setup() {
+				login = useNativeLogin();
+
+				return () => h(Child);
+			},
+		});
+
+		const app = createApp(Parent);
+		app.provide(STRIVACITY_SDK, { sdk });
+		app.mount(document.createElement('div'));
+		await flushPromises();
+
+		expect(injected?.state).toBe(login.state);
+		expect(injected?.loading).toBe(login.loading);
+		expect(injected?.forms).toBe(login.forms);
+		expect(injected?.messages).toBe(login.messages);
+		expect(injected?.submitForm).toBe(login.submitForm);
+	});
+});
+
+describe('useNativeLogin', () => {
+	test('initializes the sdk and starts a session on mount, defaulting params to an empty object', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		mountWithNativeLogin(sdk);
+
+		await flushPromises();
+
+		expect(sdk.init).toHaveBeenCalledTimes(1);
+		expect(sdk.startSession).toHaveBeenCalledWith({});
+	});
+
+	test('forwards the given login params to sdk.startSession', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		mountWithNativeLogin(sdk, { params: { sessionId: 'session-1', language: 'hu-HU' } });
+
+		await flushPromises();
+
+		expect(sdk.startSession).toHaveBeenCalledWith({ sessionId: 'session-1', language: 'hu-HU' });
+	});
+
+	test('is loading until sdk.startSession resolves with a state that has no pending finalizeUrl', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		vi.mocked(sdk.startSession).mockResolvedValue({ screen: 'identifier' });
+		const { login } = mountWithNativeLogin(sdk);
+
+		expect(login.loading.value).toBe(true);
+
+		await flushPromises();
+
+		expect(login.loading.value).toBe(false);
+	});
+
+	test('stays loading forever if sdk.startSession resolves with no state at all', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		vi.mocked(sdk.startSession).mockResolvedValue(undefined);
+		const { login } = mountWithNativeLogin(sdk);
+
+		await flushPromises();
+
+		expect(login.loading.value).toBe(true);
+	});
+
+	test('applies the returned flow state: resets per-form data, routes the global message, and keeps per-widget messages', async () => {
+		const state: NativeFlowState = {
+			hostedUrl: 'https://brandtegrity.io/hosted',
+			screen: 'identifier',
+			forms: [{ id: 'form1', type: 'form', widgets: [] }],
+			messages: {
+				global: { type: 'info', text: 'Welcome' },
+				form1: { field1: { type: 'error', text: 'Required' } },
+			},
+		};
+		const sdk = createMockFlow<NativeFlow>();
+		vi.mocked(sdk.startSession).mockResolvedValue(state);
+		const onGlobalMessage = vi.fn();
+
+		const { login } = mountWithNativeLogin(sdk, { onGlobalMessage });
+		await flushPromises();
+
+		expect(onGlobalMessage).toHaveBeenCalledWith({ type: 'info', text: 'Welcome' });
+		expect(login.forms.value).toEqual({ form1: {} });
+		expect(login.messages.value).toEqual({ form1: { field1: { type: 'error', text: 'Required' } } });
+		expect(login.state.value).toEqual(state);
+	});
+
+	test('keeps loading while a finalizeUrl is still pending', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		vi.mocked(sdk.startSession).mockResolvedValue({ finalizeUrl: 'https://brandtegrity.io/finalize' });
+
+		const { login } = mountWithNativeLogin(sdk);
+		await flushPromises();
+
+		expect(login.loading.value).toBe(true);
+	});
+
+	test('calls onLogin and leaves the tracked state untouched when the sdk already has a session', async () => {
+		const session = { access_token: 'access-token' } as unknown as SessionData;
+		const sdk = createMockFlow<NativeFlow>({ session });
+		vi.mocked(sdk.startSession).mockResolvedValue({ screen: 'identifier' });
+		const onLogin = vi.fn();
+
+		const { login } = mountWithNativeLogin(sdk, { onLogin });
+		await flushPromises();
+
+		expect(onLogin).toHaveBeenCalledWith(session);
+		expect(login.state.value).toEqual({});
+	});
+
+	test('routes a FallbackError from sdk.startSession to onFallback and logs it', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		const fallbackError = new FallbackError(new URL('https://brandtegrity.io/hosted'));
+		vi.mocked(sdk.startSession).mockRejectedValue(fallbackError);
+		const onFallback = vi.fn();
+
+		const { login } = mountWithNativeLogin(sdk, { onFallback });
+		await flushPromises();
+
+		expect(onFallback).toHaveBeenCalledWith(fallbackError);
+		expect(sdk.logging!.error).toHaveBeenCalledWith('Fallback error occurred', fallbackError);
+		expect(login.loading.value).toBe(true);
+	});
+
+	test('routes a non-fallback error from sdk.startSession to onError and logs it', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		const error = new Error('network down');
+		vi.mocked(sdk.startSession).mockRejectedValue(error);
+		const onError = vi.fn();
+
+		mountWithNativeLogin(sdk, { onError });
+		await flushPromises();
+
+		expect(onError).toHaveBeenCalledWith(error);
+		expect(sdk.logging!.error).toHaveBeenCalledWith('Error starting session', error);
+	});
+
+	describe('submitForm', () => {
+		test('unflattens the tracked form values and calls through to sdk.submitForm', async () => {
+			const sdk = createMockFlow<NativeFlow>();
+			const initialForms = [{ id: 'form1', type: 'form' as const, widgets: [] }];
+			vi.mocked(sdk.startSession).mockResolvedValue({ screen: 'identifier', forms: initialForms });
+			vi.mocked(sdk.submitForm).mockResolvedValue({ screen: 'done' });
+
+			const { login } = mountWithNativeLogin(sdk);
+			await flushPromises();
+
+			login.setFormValue('form1', 'address.city', 'Budapest');
+			login.setFormValue('form1', 'address.zip', '');
+
+			await login.submitForm('form1');
+
+			expect(sdk.submitForm).toHaveBeenCalledWith('form1', { address: { city: 'Budapest', zip: null } });
+			// unspecified fields on the new state fall back to what was already tracked (except messages, which always resets)
+			expect(login.state.value).toEqual({
+				hostedUrl: undefined,
+				finalizeUrl: undefined,
+				screen: 'done',
+				forms: initialForms,
+				layout: undefined,
+				messages: {},
+				branding: undefined,
+			});
+		});
+
+		test('uses a given custom body instead of the tracked form values', async () => {
+			const sdk = createMockFlow<NativeFlow>();
+			vi.mocked(sdk.submitForm).mockResolvedValue({ screen: 'done' });
+
+			const { login } = mountWithNativeLogin(sdk);
+			await flushPromises();
+
+			await login.submitForm('form1', { raw: true });
+
+			expect(sdk.submitForm).toHaveBeenCalledWith('form1', { raw: true });
+		});
+
+		test('routes a FallbackError to onFallback', async () => {
+			const sdk = createMockFlow<NativeFlow>();
+			const fallbackError = new FallbackError(new URL('https://brandtegrity.io/hosted'));
+			vi.mocked(sdk.submitForm).mockRejectedValue(fallbackError);
+			const onFallback = vi.fn();
+
+			const { login } = mountWithNativeLogin(sdk, { onFallback });
+			await flushPromises();
+
+			await login.submitForm('form1');
+
+			expect(onFallback).toHaveBeenCalledWith(fallbackError);
+			expect(sdk.logging!.error).toHaveBeenCalledWith('Fallback error occurred', fallbackError);
+		});
+
+		test('routes a non-fallback error to onError', async () => {
+			const sdk = createMockFlow<NativeFlow>();
+			const error = new Error('submit failed');
+			vi.mocked(sdk.submitForm).mockRejectedValue(error);
+			const onError = vi.fn();
+
+			const { login } = mountWithNativeLogin(sdk, { onError });
+			await flushPromises();
+
+			await login.submitForm('form1');
+
+			expect(onError).toHaveBeenCalledWith(error);
+			expect(sdk.logging!.error).toHaveBeenCalledWith('Error submitting form', error);
+		});
+	});
+
+	test('setFormValue coerces empty strings to null and lazily creates the form bucket', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		const { login } = mountWithNativeLogin(sdk);
+		await flushPromises();
+
+		login.setFormValue('newForm', 'field', 'value');
+		login.setFormValue('newForm', 'other', '');
+
+		expect(login.forms.value.newForm).toEqual({ field: 'value', other: null });
+	});
+
+	test('setMessage lazily creates the message bucket for a form', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		const { login } = mountWithNativeLogin(sdk);
+		await flushPromises();
+
+		login.setMessage('newForm', 'field', { type: 'error', text: 'Required' });
+
+		expect(login.messages.value.newForm).toEqual({ field: { type: 'error', text: 'Required' } });
+	});
+
+	describe('triggerFallback', () => {
+		test('throws when no hosted URL is known yet', async () => {
+			const sdk = createMockFlow<NativeFlow>();
+			vi.mocked(sdk.startSession).mockResolvedValue({ screen: 'identifier' });
+			const { login } = mountWithNativeLogin(sdk);
+			await flushPromises();
+
+			expect(() => login.triggerFallback()).toThrow('No hosted URL provided');
+			expect(sdk.logging!.error).toHaveBeenCalledWith('Fallback error', expect.any(Error));
+		});
+
+		test('calls onFallback with a FallbackError built from the known hosted URL', async () => {
+			const sdk = createMockFlow<NativeFlow>();
+			vi.mocked(sdk.startSession).mockResolvedValue({ hostedUrl: 'https://brandtegrity.io/hosted', screen: 'identifier' });
+			const onFallback = vi.fn();
+
+			const { login } = mountWithNativeLogin(sdk, { onFallback });
+			await flushPromises();
+
+			login.triggerFallback('manual trigger');
+
+			expect(sdk.logging!.warn).toHaveBeenCalledWith('Triggering fallback due to: manual trigger');
+			expect(onFallback).toHaveBeenCalledWith(expect.any(FallbackError));
+			expect((onFallback.mock.calls[0][0] as FallbackError).url.toString()).toBe('https://brandtegrity.io/hosted');
+		});
+	});
+
+	test('triggerClose calls onClose and logs', async () => {
+		const sdk = createMockFlow<NativeFlow>();
+		const onClose = vi.fn();
+		const { login } = mountWithNativeLogin(sdk, { onClose });
+		await flushPromises();
+
+		login.triggerClose();
+
+		expect(onClose).toHaveBeenCalledTimes(1);
+		expect(sdk.logging!.debug).toHaveBeenCalledWith('Triggering close');
+	});
+});

package/testing/tests/errors.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from 'vitest';
+import * as vueErrors from '../../src/errors';
+import * as coreErrors from '@strivacity/sdk-core/utils/errors';
+
+test('re-exports error classes from the core sdk', () => {
+	const coreKeys = Object.keys(coreErrors);
+
+	expect(coreKeys.length).toBeGreaterThan(0);
+	expect(Object.keys(vueErrors).sort()).toEqual(coreKeys.sort());
+});

package/testing/tests/index.spec.ts

@@ -0,0 +1,105 @@
+import { test, expect } from 'vitest';
+import * as index from '../../src/index';
+
+test('should export the correct things', () => {
+	const expectedExports = [
+		'createBaseFlow',
+		'createEmbeddedFlow',
+		'createNativeFlow',
+		'createPopupFlow',
+		'createRedirectFlow',
+		'popupCallbackHandler',
+		'popupUrlHandler',
+		'redirectCallbackHandler',
+		'redirectUrlHandler',
+		'BACKCHANNEL_LOGOUT_EVENT',
+		'ConfigurationError',
+		'DEFAULT_COOKIE_MAX_AGE',
+		'DISALLOWED_PROXY_HEADERS',
+		'FallbackError',
+		'InternalError',
+		'NetworkError',
+		'OidcError',
+		'PopupBlockedError',
+		'PopupClosedError',
+		'ProtocolError',
+		'RETURN_TO_COOKIE',
+		'ServerError',
+		'SessionExpiredError',
+		'UnsupportedFlowError',
+		'assertWebAuthnCredential',
+		'buildAuthorizationUrl',
+		'buildCookieString',
+		'buildEndSessionUrl',
+		'createDefaultLogging',
+		'createHttpClient',
+		'createSession',
+		'createState',
+		'createWebAuthnCredential',
+		'decodeBase64URL',
+		'decodeJwt',
+		'decryptString',
+		'defaultOptions',
+		'encodeBase64URL',
+		'encryptString',
+		'exchangeCode',
+		'fetchFlowEntry',
+		'finalizeLoginSession',
+		'flushSetCookies',
+		'generateCodeChallenge',
+		'generateCodeVerifier',
+		'generateJwt',
+		'generateRandomHex',
+		'getDefaultFlowState',
+		'getDiscoveryDocument',
+		'getSDKOptions',
+		'getServerSDKOptions',
+		'injectScript',
+		'isSessionExpired',
+		'loadSession',
+		'parseCookieHeader',
+		'parseState',
+		'proxyResponse',
+		'pushSetCookie',
+		'refreshToken',
+		'revokeToken',
+		'serializeCookie',
+		'serializeSession',
+		'serializeState',
+		'submitLoginForm',
+		'throwHttpError',
+		'throwTokenEndpointError',
+		'timestamp',
+		'toSafeRedirect',
+		'unflattenObject',
+		'verifyIdToken',
+		'verifyJwt',
+		'STRIVACITY_SDK',
+		'STRIVACITY_LOGIN_CONTEXT',
+		'useStrivacity',
+		'useNativeLoginContext',
+		'useNativeLogin',
+		'createStrivacitySDK',
+		'COOKIE_CHUNK_SIZE',
+		'COOKIE_CONTEXT',
+		'createCacheAPIStorage',
+		'createEncryptedCookieStorage',
+		'createIndexedDBStorage',
+		'createLocalStorage',
+		'createMemoryStorage',
+		'createServerMemoryStorage',
+		'createServerStateStorage',
+		'createSessionIdCookieStorage',
+		'createSessionStorage',
+		'createWorkerStorage',
+		'handleWorkerStorageRequests',
+		'AlgorithmTypeList',
+		'GrantTypeList',
+		'ResponseModeList',
+		'ResponseTypeList',
+		'SubjectTypeList',
+		'TokenEndpointAuthMethodList',
+	];
+
+	expect(Object.keys(index)).toEqual(expectedExports);
+});

package/testing/tests/plugin.spec.ts

@@ -0,0 +1,129 @@
+import type { RedirectFlow } from '../../src/types';
+import { describe, test, expect, vi, beforeEach } from 'vitest';
+import { createApp } from 'vue';
+import { initFlow } from '@strivacity/sdk-core';
+import { createStrivacitySDK } from '../../src/plugin';
+import { flushPromises } from '@strivacity/testing/mocks/common';
+import { createMockFlow } from '@strivacity/testing/mocks/sdk';
+import { install } from '../utils/common';
+
+vi.mock('@strivacity/sdk-core', async (importOriginal) => ({
+	...(await importOriginal<typeof import('@strivacity/sdk-core')>()),
+	initFlow: vi.fn(),
+}));
+
+describe('createStrivacitySDK', () => {
+	beforeEach(() => {
+		vi.mocked(initFlow).mockReset();
+	});
+
+	test('initializes the underlying flow through core sdk initFlow with the given options', () => {
+		const flow = createMockFlow<RedirectFlow>();
+		const options = { mode: 'redirect' as const, issuer: 'https://brandtegrity.io', clientId: 'client-id', redirectUri: 'https://brandtegrity.io/callback' };
+
+		vi.mocked(initFlow).mockReturnValue(flow as never);
+
+		const app = createApp({ setup: () => () => null });
+		app.use(createStrivacitySDK(options));
+		app.mount(document.createElement('div'));
+
+		expect(initFlow).toHaveBeenCalledTimes(1);
+		expect(initFlow).toHaveBeenCalledWith(options);
+	});
+
+	test('subscribes to all sdk events on install and disposes on unmount', () => {
+		const dispose = vi.fn();
+		const flow = createMockFlow<RedirectFlow>({ subscribeToAllEvents: vi.fn().mockReturnValue({ dispose }) });
+		const { app } = install(flow);
+
+		expect(flow.subscribeToAllEvents).toHaveBeenCalledTimes(1);
+		expect(flow.subscribeToAllEvents).toHaveBeenCalledWith(expect.any(Function));
+
+		app.unmount();
+
+		expect(dispose).toHaveBeenCalledTimes(1);
+	});
+
+	test.each([
+		['init', [], undefined],
+		['subscribeToEvent', ['loggedIn', vi.fn()], { dispose: vi.fn() }],
+		['checkAuthentication', [{ autoRefresh: false }], true],
+		['tokenExchange', [{ code: 'abc' }], undefined],
+		['handleCallback', ['https://brandtegrity.io/callback?code=abc'], undefined],
+		['refresh', [], undefined],
+		['revoke', [], undefined],
+		['logout', [{ postLogoutRedirectUri: 'https://brandtegrity.io' }], undefined],
+		['login', [{ scopes: ['openid'] }], undefined],
+		['register', [{ scopes: ['openid'] }], undefined],
+		['entry', ['https://brandtegrity.io/entry'], undefined],
+	] as const)('%s calls through to the flow instance returned by core sdk', async (method, args, resolvedValue) => {
+		const flow = createMockFlow<RedirectFlow>({ [method]: vi.fn().mockReturnValue(resolvedValue) });
+		const { context } = install(flow);
+
+		const result = await (context[method] as (...a: Array<unknown>) => unknown)(...args);
+
+		expect(flow[method as keyof RedirectFlow]).toHaveBeenCalledWith(...args);
+		expect(result).toEqual(resolvedValue);
+	});
+
+	test('subscribeToAllEvents on the context calls through to the flow instance', () => {
+		const callback = vi.fn();
+		const disposeResult = { dispose: vi.fn() };
+		const flow = createMockFlow<RedirectFlow>();
+		vi.mocked(flow.subscribeToAllEvents).mockReturnValue(disposeResult);
+
+		const { context } = install(flow);
+		// the install-time subscription happens first; this is the caller-facing pass-through
+		const result = context.subscribeToAllEvents(callback);
+
+		expect(flow.subscribeToAllEvents).toHaveBeenLastCalledWith(callback);
+		expect(result).toBe(disposeResult);
+	});
+
+	test('exposes reactive state seeded from the flow instance after the initial session update settles', async () => {
+		const flow = createMockFlow<RedirectFlow>({
+			isAuthenticated: Promise.resolve(true),
+			language: 'hu-HU',
+			idTokenClaims: { sub: 'user-1' },
+			accessToken: 'access-token',
+			refreshToken: 'refresh-token',
+			accessTokenExpired: false,
+			accessTokenExpirationDate: 1234,
+		});
+		const { context } = install(flow);
+
+		expect(context.loading.value).toBe(true);
+
+		await flushPromises();
+
+		expect(context.loading.value).toBe(false);
+		expect(context.isAuthenticated.value).toBe(true);
+		expect(context.language.value).toBe('hu-HU');
+		expect(context.idTokenClaims.value).toEqual({ sub: 'user-1' });
+		expect(context.accessToken.value).toBe('access-token');
+		expect(context.refreshToken.value).toBe('refresh-token');
+		expect(context.accessTokenExpired.value).toBe(false);
+		expect(context.accessTokenExpirationDate.value).toBe(1234);
+	});
+
+	test('reactive state updates when the flow emits an event', async () => {
+		const subscribeToAllEvents = vi.fn().mockReturnValue({ dispose: vi.fn() });
+		const flow = createMockFlow<RedirectFlow>({ subscribeToAllEvents });
+		const { context } = install(flow);
+		await flushPromises();
+
+		const onEvent = subscribeToAllEvents.mock.calls[0][0];
+		const mutableFlow = flow as { language: string; accessToken: string | null; isAuthenticated: Promise<boolean> };
+
+		mutableFlow.language = 'de-DE';
+		mutableFlow.accessToken = 'new-token';
+		mutableFlow.isAuthenticated = Promise.resolve(true);
+
+		await onEvent();
+		await flushPromises();
+
+		expect(context.language.value).toBe('de-DE');
+		expect(context.accessToken.value).toBe('new-token');
+		expect(context.isAuthenticated.value).toBe(true);
+	});
+});

package/testing/tests/storages.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from 'vitest';
+import * as vueStorages from '../../src/storages';
+import * as coreStorages from '@strivacity/sdk-core/storages';
+
+test('re-exports storages from the core sdk', () => {
+	const coreKeys = Object.keys(coreStorages);
+
+	expect(coreKeys.length).toBeGreaterThan(0);
+	expect(Object.keys(vueStorages).sort()).toEqual(coreKeys.sort());
+});

package/testing/tests/utils.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from 'vitest';
+import * as vueUtils from '../../src/utils';
+import * as coreUtils from '@strivacity/sdk-core/utils';
+
+test('re-exports utility from the core sdk', () => {
+	const coreKeys = Object.keys(coreUtils);
+
+	expect(coreKeys.length).toBeGreaterThan(0);
+	expect(Object.keys(vueUtils).sort()).toEqual(coreKeys.sort());
+});

package/testing/utils/common.ts

@@ -0,0 +1,53 @@
+import type { SDKContext, LoginContext, UseNativeLoginOptions, RedirectFlow, NativeFlow } from '../../src/types';
+import { vi } from 'vitest';
+import { createApp, inject, type App } from 'vue';
+import { initFlow } from '@strivacity/sdk-core';
+import { STRIVACITY_SDK, useNativeLogin } from '../../src/composables';
+import { createStrivacitySDK } from '../../src/plugin';
+
+export function mount(sdk: unknown, setup: () => void) {
+	const app = createApp({
+		setup() {
+			setup();
+			return () => null;
+		},
+	});
+	app.provide(STRIVACITY_SDK, { sdk });
+	app.mount(document.createElement('div'));
+
+	return app;
+}
+
+export function install(flow: RedirectFlow): { app: App; context: SDKContext<RedirectFlow> } {
+	vi.mocked(initFlow).mockReturnValue(flow as never);
+
+	let context: SDKContext<RedirectFlow> | undefined;
+	const app = createApp({
+		setup() {
+			context = inject<SDKContext<RedirectFlow>>(STRIVACITY_SDK);
+
+			return () => null;
+		},
+	});
+
+	app.use(
+		createStrivacitySDK({
+			mode: 'redirect',
+			issuer: 'https://brandtegrity.io',
+			clientId: 'client-id',
+			redirectUri: 'https://brandtegrity.io/callback',
+		}),
+	);
+	app.mount(document.createElement('div'));
+
+	return { app, context: context! };
+}
+
+export function mountWithNativeLogin(sdk: NativeFlow, options: UseNativeLoginOptions = {}) {
+	let login!: LoginContext;
+	const app = mount(sdk, () => {
+		login = useNativeLogin(options);
+	});
+
+	return { app, login };
+}

package/tsconfig.app.json

@@ -0,0 +1,4 @@
+{
+  "extends": "./tsconfig.json",
+  "include": ["./src/**/*.ts", "./src/**/*.vue"]
+}

package/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../../tsconfig.base.json"
+}