fix(core): fail to clean up framework observers

packages/core/__tests__/Platform-test.ts

@@ -9,7 +9,18 @@ import { detectFramework, clearCache } from '../src/Platform/detectFramework';
 import * as detection from '../src/Platform/detection';
 
 describe('Platform test', () => {
-	beforeEach(() => clearCache());
+	beforeAll(() => {
+		jest.useFakeTimers();
+	});
+
+	afterAll(() => {
+		jest.useRealTimers();
+	});
+
+	beforeEach(() => {
+		clearCache();
+	});
+
 	describe('isReactNative test', () => {
 		test('happy case', () => {
 			expect(Platform.isReactNative).toBe(false);
@@ -70,8 +81,6 @@ describe('Platform test', () => {
 
 	describe('detectFramework', () => {
 		test('retries detection after 10ms', () => {
-			jest.useFakeTimers();
-
 			jest.spyOn(detection, 'detect');
 
 			detectFramework();
@@ -81,3 +90,33 @@ describe('Platform test', () => {
 		});
 	});
 });
+
+describe('detectFramework observers', () => {
+	let module;
+
+	beforeAll(() => {
+		jest.resetModules();
+		module = require('../src/Platform/detectFramework');
+		jest.useFakeTimers();
+	});
+
+	afterAll(() => {
+		jest.useRealTimers();
+	});
+
+	test('it notifies and cleans up the observers and rejects new observer after detection completes', () => {
+		const mockObserver = jest.fn();
+		module.observeFrameworkChanges(mockObserver);
+		expect(module.frameworkChangeObservers.length).toBe(1);
+
+		module.detectFramework();
+		expect(mockObserver).toHaveBeenCalledTimes(1);
+		jest.runOnlyPendingTimers();
+		module.detectFramework();
+		expect(mockObserver).toHaveBeenCalledTimes(2);
+		expect(module.frameworkChangeObservers.length).toBe(0);
+
+		module.observeFrameworkChanges(mockObserver);
+		expect(module.frameworkChangeObservers.length).toBe(0);
+	});
+});

packages/core/src/Platform/detectFramework.ts

@@ -7,7 +7,7 @@ import { detect } from './detection';
 // We want to cache detection since the framework won't change
 let frameworkCache: Framework | undefined;
 
-const frameworkChangeObservers: (() => void)[] = [];
+export const frameworkChangeObservers: (() => void)[] = [];
 
 // Setup the detection reset tracking / timeout delays
 let resetTriggered = false;
@@ -19,8 +19,19 @@ export const detectFramework = (): Framework => {
 	if (!frameworkCache) {
 		frameworkCache = detect();
 
-		// Everytime we update the cache, call each observer function
-		frameworkChangeObservers.forEach(fcn => fcn());
+		if (resetTriggered) {
+			// The final run of detectFramework:
+			// Starting from this point, the `frameworkCache` becomes "final".
+			// So we don't need to notify the observers again so the observer
+			// can be removed after the final notice.
+			while (frameworkChangeObservers.length) {
+				frameworkChangeObservers.pop()();
+			}
+		} else {
+			// The first run of detectFramework:
+			// Every time we update the cache, call each observer function
+			frameworkChangeObservers.forEach(fcn => fcn());
+		}
 
 		// Retry once for either Unknown type after a delay (explained below)
 		resetTimeout(Framework.ServerSideUnknown, SSR_RESET_TIMEOUT);
@@ -33,6 +44,12 @@ export const detectFramework = (): Framework => {
  * @internal Setup observer callback that will be called everytime the framework changes
  */
 export const observeFrameworkChanges = (fcn: () => void) => {
+	// When the `frameworkCache` won't be updated again, we ignore all incoming
+	// observers.
+	if (resetTriggered) {
+		return;
+	}
+
 	frameworkChangeObservers.push(fcn);
 };