Merge pull request #334 from ckeditor/ck/print-cdn-errors-in-console

Feat: Log cloud fetch errors to console.

demos/editor-cdn/App.vue

@@ -37,7 +37,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, effect } from 'vue';
+import { ref, reactive, computed } from 'vue';
 import useCKEditorCloud from '../../src/useCKEditorCloud.js';
 import type { EventInfo, ClassicEditor } from 'https://cdn.ckeditor.com/typings/ckeditor5.d.ts';
 
@@ -46,12 +46,6 @@ const cloud = useCKEditorCloud( {
 	version: '43.0.0'
 } );
 
-effect( () => {
-	if ( cloud.error.value ) {
-		console.error( cloud.error.value );
-	}
-} );
-
 const TestEditor = computed<typeof ClassicEditor | null>( () => {
 	if ( !cloud.data.value ) {
 		return null;

src/composables/useAsync.ts

@@ -61,6 +61,8 @@ export const useAsync = <R>(
 				data.value = result;
 			}
 		} catch ( err: any ) {
+			console.error( err );
+
 			if ( !shouldDiscardQuery() ) {
 				error.value = err;
 			}

tests/composables/useAsync.test.ts

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md.
  */
 
-import { it, describe, expect } from 'vitest';
+import { it, vi, describe, expect } from 'vitest';
 import { ref } from 'vue';
 import { flushPromises } from '@vue/test-utils';
 
@@ -42,6 +42,20 @@ describe( 'useAsync', () => {
 		expect( data.value ).toBe( null );
 	} );
 
+	it( 'should print errors in console if the async function throws an error', async () => {
+		const errorInstance = new Error( 'test' );
+		const consoleSpy = vi.spyOn( console, 'error' );
+
+		useAsync( async () => {
+			throw errorInstance;
+		} );
+
+		await flushPromises();
+
+		expect( consoleSpy ).toHaveBeenCalledWith( errorInstance );
+		consoleSpy.mockRestore();
+	} );
+
 	it( 'should re-run async function on change ref inside async function', async () => {
 		const refValue = ref( 0 );
 		const { data } = useAsync( async () => refValue.value );