a5490b25-eb49-473c-a74b-12e44ced0a06

Committed 24 Sep 2024 01:48PM UTC coverage: 100.0%. Remained the same

Build # a5490b25-eb49-473c-a74b-12e44ced0a06

Build Type

Pull #318

circleci

Committed by

martnpaneq

Commit Message

Updated dependency versions to remove warnings.

Pull Request Pull Request #318: Updated dependency versions to remove warnings.

Run Details

30 of 30 branches covered (100.0%)

Branch coverage included in aggregate %.

79 of 79 relevant lines covered (100.0%)

33.77 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

100.0

/src/composables/useAsync.ts

/**
 * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see LICENSE.md.
 */

import {
        computed, ref,
        shallowReadonly, watchEffect,
        type ComputedRef, type Ref
} from 'vue';

import { uid } from '@ckeditor/ckeditor5-integrations-common';

/**
 * A composable that executes an async function and provides the result.
 *
 * @param asyncFunc The async function to execute.
 * @returns The result of the async function.
 * @example
 *
 * ```ts
 * const { loading, data, error } = useAsync( async () => {
 *         const response = await fetch( 'https://api.example.com/data' );
 *         return response.json();
 * } );
 * ```
 */
export const useAsync = <R>(
        asyncFunc: () => Promise<R>
): AsyncComposableResult<R> => {
        // The UUID of the last query to prevent race conditions between multiple queries.
        const lastQueryUUID = ref<string | null>( null );

        // The error thrown by the async function.
        const error = ref<Error | null>( null );

        // The data returned by the async function.
        const data: Ref<R | null> = ref( null );

        // Whether the async function is currently loading.
        const loading = computed( () => lastQueryUUID.value !== null );

        // Execute the async function and update the result. This will be re-executed
        // whenever refs used inside the `asyncFunc` change.
        watchEffect( async () => {
                const currentQueryUID = uid();

                lastQueryUUID.value = currentQueryUID;
                data.value = null;
                error.value = null;

                // This function is called before updating `data`, `error` or `loading`
                // because the `watchEffect` could be re-triggered with the new data
                // while waiting for the previous `asyncFunc` to resolve.
                const shouldDiscardQuery = () => lastQueryUUID.value !== currentQueryUID;

                try {
                        const result = await asyncFunc();

                        if ( !shouldDiscardQuery() ) {
                                data.value = result;
                        }
                } catch ( err: any ) {
                        if ( !shouldDiscardQuery() ) {
                                error.value = err;
                        }
                } finally {
                        if ( !shouldDiscardQuery() ) {
                                lastQueryUUID.value = null;
                        }
                }
        } );

        return {
                loading: shallowReadonly( loading ),
                data: shallowReadonly( data ),
                error: shallowReadonly( error )
        };
};

/**
 * The result of the `useAsync` composable.
 */
export type AsyncComposableResult<R> = {

        /**
         * Whether the async function is currently loading.
         */
        loading: ComputedRef<boolean>;

        /**
         *         The data returned by the async function.
         */
        data: Ref<R | null>;

        /**
         * The error thrown by the async function.
         */
        error: Ref<Error | null>;
};

1	/**
2	* @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
3	* For licensing, see LICENSE.md.
4	*/
5
6	import {
7	computed, ref,
8	shallowReadonly, watchEffect,
9	type ComputedRef, type Ref
10	} from 'vue';
11
12	import { uid } from '@ckeditor/ckeditor5-integrations-common';
13
14	/**
15	* A composable that executes an async function and provides the result.
16	*
17	* @param asyncFunc The async function to execute.
18	* @returns The result of the async function.
19	* @example
20	*
21	* ```ts
22	* const { loading, data, error } = useAsync( async () => {
23	* const response = await fetch( 'https://api.example.com/data' );
24	* return response.json();
25	* } );
26	* ```
27	*/
28	export const useAsync = <R>(	6✔
29	asyncFunc: () => Promise<R>
30	): AsyncComposableResult<R> => {
31	// The UUID of the last query to prevent race conditions between multiple queries.
32	const lastQueryUUID = ref<string \| null>( null );	13✔
33
34	// The error thrown by the async function.
35	const error = ref<Error \| null>( null );	13✔
36
37	// The data returned by the async function.
38	const data: Ref<R \| null> = ref( null );	13✔
39
40	// Whether the async function is currently loading.
41	const loading = computed( () => lastQueryUUID.value !== null );	13✔
42
43	// Execute the async function and update the result. This will be re-executed
44	// whenever refs used inside the `asyncFunc` change.
45	watchEffect( async () => {	13✔
46	const currentQueryUID = uid();	17✔
47
48	lastQueryUUID.value = currentQueryUID;	17✔
49	data.value = null;	17✔
50	error.value = null;	17✔
51
52	// This function is called before updating `data`, `error` or `loading`
53	// because the `watchEffect` could be re-triggered with the new data
54	// while waiting for the previous `asyncFunc` to resolve.
55	const shouldDiscardQuery = () => lastQueryUUID.value !== currentQueryUID;	34✔
56
57	try {	17✔
58	const result = await asyncFunc();	17✔
59
60	if ( !shouldDiscardQuery() ) {	15✔
61	data.value = result;	13✔
62	}
63	} catch ( err: any ) {
64	if ( !shouldDiscardQuery() ) {	2✔
65	error.value = err;	1✔
66	}
67	} finally {
68	if ( !shouldDiscardQuery() ) {	17✔
69	lastQueryUUID.value = null;	14✔
70	}
71	}
72	} );
73
74	return {	13✔
75	loading: shallowReadonly( loading ),
76	data: shallowReadonly( data ),
77	error: shallowReadonly( error )
78	};
79	};
80
81	/**
82	* The result of the `useAsync` composable.
83	*/
84	export type AsyncComposableResult<R> = {
85
86	/**
87	* Whether the async function is currently loading.
88	*/
89	loading: ComputedRef<boolean>;
90
91	/**
92	* The data returned by the async function.
93	*/
94	data: Ref<R \| null>;
95
96	/**
97	* The error thrown by the async function.
98	*/
99	error: Ref<Error \| null>;
100	};

ckeditor / ckeditor5-vue / a5490b25-eb49-473c-a74b-12e44ced0a06

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous