fix(i-data): componentStatus updating after component destroying

CHANGELOG.md

@@ -11,6 +11,16 @@ Changelog
 
 _Note: Gaps between patch versions are faulty, broken or test releases._
 
+## v4.0.0-beta.?? (2024-10-??)
+
+#### :rocket: New Feature
+
+* Added `JSHandle` representing the mock agent in `SpyObject.handle` `tests/helpers/mock`
+
+#### :bug: Bug Fix
+
+* Fixed an issue with updating the `componentStatus` after destroying the component `iData`
+
 ## v4.0.0-beta.142 (2024-10-04)
 
 #### :bug: Bug Fix

src/components/super/i-data/CHANGELOG.md

@@ -9,6 +9,12 @@ Changelog
 > - :house:      [Internal]
 > - :nail_care:  [Polish]
 
+## v4.0.0-beta.?? (2024-10-??)
+
+#### :bug: Bug Fix
+
+* Fixed an issue with updating the `componentStatus` after destroying the component
+
 ## v4.0.0-beta.30 (2023-10-11)
 
 #### :bug: Bug Fix

src/components/super/i-data/i-data.ts

@@ -80,7 +80,7 @@ export default abstract class iData extends iDataHandlers {
 			join: 'replace'
 		};
 
-		const callSuper = () => super.initLoad(() => this.db, opts);
+		const callSuper = $a.proxy(() => super.initLoad(() => this.db, opts));
 
 		try {
 			if (opts.emitStartEvent !== false) {

src/components/super/i-data/test/unit/main.ts

@@ -0,0 +1,40 @@
+/*!
+ * V4Fire Client Core
+ * https://github.com/V4Fire/Client
+ *
+ * Released under the MIT license
+ * https://github.com/V4Fire/Client/blob/master/LICENSE
+ */
+
+import test from 'tests/config/unit/test';
+import { Component, RequestInterceptor } from 'tests/helpers';
+import { createMockFn } from 'tests/helpers/mock';
+
+test.describe('<i-data> component', () => {
+	test.beforeEach(async ({demoPage}) => {
+		await demoPage.goto();
+	});
+
+	test('should not update the `componentStatus` if the component was destroyed during the loading', async ({page}) => {
+		const interceptor = new RequestInterceptor(page, /api/);
+		await interceptor
+			.response(200, {root: true}, {delay: 100})
+			.start();
+
+		const target = await Component.createComponent(page, 'b-dummy', {
+			attrs: {
+				dataProvider: 'Provider'
+			}
+		});
+
+		const mockStatusChange = await createMockFn(page, (...args) => args);
+
+		await target.evaluate((ctx, mock) => {
+			ctx.on('onComponentStatusChange', mock);
+
+			ctx.unsafe.$destroy();
+		}, mockStatusChange.handle);
+
+		test.expect(await mockStatusChange.calls).toEqual([['destroyed', 'loading']]);
+	});
+});

tests/CHANGELOG.md

@@ -9,6 +9,12 @@ Changelog
 > - :house:      [Internal]
 > - :nail_care:  [Polish]
 
+## v4.0.0-beta.?? (2024-10-??)
+
+#### :rocket: New Feature
+
+* Added `JSHandle` representing the mock agent in `SpyObject.handle`
+
 ## v4.0.0 (2023-04-19)
 
 #### :boom: Breaking Change

tests/helpers/mock/README.md

@@ -85,17 +85,13 @@ console.log(await spy.calls); // [[], []]
 To create a mock function, use the `createMockFn` function. It will create a mock function and automatically inject it into the page.
 
 ```typescript
-import { expandedStringify } from 'core/prelude/test-env/components/json';
-
 const mockFn = await createMockFn(page, () => 1);
 
-await page.evaluate(([obj]) => {
-  const parsed = globalThis.expandedParse(obj);
-
-  parsed.mockFn();
-  parsed.mockFn();
+await page.evaluate(([mock]) => {
+  mock();
+  mock();
 
-}, <const>[expandedStringify({ mockFn })]);
+}, <const>[mockFn.handle]);
 
 console.log(await mockFn.calls); // [[], []]
 ```

tests/helpers/mock/index.ts

@@ -27,6 +27,10 @@ export function wrapAsSpy<T extends object>(agent: JSHandle<ReturnType<ModuleMoc
 			get: () => agent.evaluate((ctx) => ctx.mock.calls)
 		},
 
+		handle: {
+			get: () => agent
+		},
+
 		callsCount: {
 			get: () => agent.evaluate((ctx) => ctx.mock.calls.length)
 		},

tests/helpers/mock/interface.ts

@@ -13,6 +13,11 @@ import type { ModuleMocker } from 'jest-mock';
  * Represents a spy object with properties for accessing spy information.
  */
 export interface SpyObject {
+	/**
+	 * The {@link JSHandle} representing the spy object
+	 */
+	readonly handle: JSHandle<ReturnType<ModuleMocker['fn']> | ReturnType<ModuleMocker['spyOn']>>;
+
 	/**
 	 * The array of arguments passed to the spy function on each call.
 	 */