@atlassian/clientside-extensions-components 2.4.1 → 2.5.0-84fa90d-kwd5ix2w

package/dist/cjs/useExtensions.test.js

@@ -1,647 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const utils_1 = require("ts-jest/utils");
-const react_hooks_1 = require("@testing-library/react-hooks");
-const clientside_extensions_registry_1 = tslib_1.__importDefault(require("@atlassian/clientside-extensions-registry"));
-const debug = tslib_1.__importStar(require("@atlassian/clientside-extensions-debug"));
-const clientside_extensions_debug_1 = require("@atlassian/clientside-extensions-debug");
-const clientside_extensions_schema_1 = require("@atlassian/clientside-extensions-schema");
-const useExtensions_1 = require("./useExtensions");
-jest.mock('@atlassian/clientside-extensions-registry');
-debug.setLoggingEnabled(true);
-debug.setDebugEnabled(true);
-// avoid spamming the console with error/warn messages
-// eslint-disable-next-line no-underscore-dangle
-debug._deregisterDefaultLogger();
-function applyAttributesProvider(descriptor) {
-    const { attributesProvider, ...restDescriptor } = descriptor;
-    return {
-        ...restDescriptor,
-        attributes: {
-            ...restDescriptor.attributes,
-            ...(attributesProvider ? attributesProvider({ updateAttributes: () => { }, onCleanup: () => { } }, null) : {}),
-        },
-    };
-}
-function createMockLocationObserver() {
-    let locationObserver;
-    utils_1.mocked(clientside_extensions_registry_1.default.getLocation).mockClear();
-    utils_1.mocked(clientside_extensions_registry_1.default.getLocation).mockImplementation(() => ({
-        subscribe: (observer) => {
-            locationObserver = observer;
-            return {
-                unsubscribe: () => { },
-            };
-        },
-    }));
-    return (payload) => locationObserver(payload);
-}
-const attributeValidator = () => ({ warnings: [], errors: [] });
-const contextValidator = () => ({ warnings: [], errors: [] });
-const options = {
-    attributeValidator,
-    contextValidator,
-};
-const supportedExtension = {
-    key: 'fake-1',
-    location: 'fake-location',
-    weight: 10,
-    attributes: { label: 'a fake label' },
-    attributesProvider: () => ({ type: 'button' }),
-};
-const unsupportedExtension = {
-    key: 'fake-2',
-    location: 'fake-location',
-    weight: 10,
-    attributes: { label: 'a fake label' },
-};
-const wrongTypeExtension = {
-    key: 'fake-3',
-    location: 'fake-location',
-    weight: 10,
-    attributes: { label: 'a fake label' },
-    attributesProvider: () => ({ type: 'oopps' }),
-};
-const brokenExtension = {
-    key: 'fake-4',
-    location: 'fake-location',
-    weight: 10,
-    attributes: { label: 'a fake label' },
-    attributesProvider: () => {
-        throw new Error('fake error');
-    },
-};
-const brokenOnActionExtension = {
-    key: 'fake-button',
-    location: 'fake-location',
-    weight: 10,
-    attributes: { label: 'a fake label' },
-    attributesProvider: () => ({
-        type: 'button',
-        onAction: () => {
-            throw new Error('error from onAction');
-        },
-    }),
-};
-const toEvaluatedDecorator = (descriptor) => {
-    const { attributesProvider, attributes, ...rest } = descriptor;
-    const ensureAP = attributesProvider !== null && attributesProvider !== void 0 ? attributesProvider : (() => ({}));
-    const evaluatedAttributes = { ...attributes, ...ensureAP({}, null) };
-    return {
-        ...rest,
-        attributes: evaluatedAttributes,
-    };
-};
-describe('useExtensionsLoadingState hook', () => {
-    let locationObserver;
-    beforeEach(() => {
-        locationObserver = createMockLocationObserver();
-    });
-    it('should notify when the loading state changes', () => {
-        let loading;
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsLoadingState('fake-location', null, options));
-        loading = result.current;
-        expect(loading).toBe(true);
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [], loadingState: false });
-        });
-        loading = result.current;
-        expect(loading).toBe(false);
-    });
-});
-describe('useExtensions hook', () => {
-    let locationObserver;
-    beforeEach(() => {
-        locationObserver = createMockLocationObserver();
-    });
-    it('should return a list with only the supported extensions', () => {
-        const localValidate = (descriptor) => {
-            return JSON.stringify(descriptor) === '{"label":"a fake label","type":"button"}'
-                ? { errors: [], warnings: [] }
-                : {
-                    errors: [
-                        {
-                            severity: clientside_extensions_schema_1.ErrorLevels.ERROR,
-                            error: 'asd',
-                        },
-                    ],
-                    warnings: [],
-                };
-        };
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensions('fake-location', null, { ...options, attributeValidator: localValidate }));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [supportedExtension, unsupportedExtension, wrongTypeExtension], loadingState: false });
-        });
-        const extensions = result.current;
-        expect(extensions).toEqual([
-            {
-                ...applyAttributesProvider(supportedExtension),
-            },
-        ]);
-    });
-});
-describe('useExtensionsUnsupported hook', () => {
-    let locationObserver;
-    beforeEach(() => {
-        locationObserver = createMockLocationObserver();
-    });
-    it('should return a list with only the unsupported extensions', () => {
-        const localValidate = (descriptor) => {
-            const { type } = descriptor;
-            return type === 'button'
-                ? { errors: [], warnings: [] }
-                : {
-                    errors: [
-                        {
-                            severity: clientside_extensions_schema_1.ErrorLevels.ERROR,
-                            error: 'asd',
-                        },
-                    ],
-                    warnings: [],
-                };
-        };
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsUnsupported('fake-location', null, { ...options, attributeValidator: localValidate }));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [supportedExtension, unsupportedExtension, wrongTypeExtension], loadingState: false });
-        });
-        const extensions = result.current;
-        expect(extensions).toEqual([toEvaluatedDecorator(unsupportedExtension), toEvaluatedDecorator(wrongTypeExtension)]);
-    });
-});
-describe('useExtensionsAll hook', () => {
-    const loggerLogs = [];
-    const onDebugSpy = jest.fn().mockImplementation((payload) => {
-        loggerLogs.push(payload);
-    });
-    debug.observeLogger(onDebugSpy);
-    let locationObserver;
-    beforeEach(() => {
-        locationObserver = createMockLocationObserver();
-    });
-    afterEach(() => {
-        loggerLogs.length = 0;
-        onDebugSpy.mockClear();
-    });
-    it('should return an empty array if no extensions are registered for an extension point', () => {
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, options));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [], loadingState: false });
-        });
-        const [extensions, unsupportedExtensions, loading] = result.current;
-        expect(extensions).toEqual([]);
-        expect(unsupportedExtensions).toEqual([]);
-        expect(loading).toBe(false);
-    });
-    it('should only return extensions of a supported type and log validation type error', () => {
-        const localValidate = (descriptor) => {
-            const { type } = descriptor;
-            return type !== 'oopps'
-                ? { warnings: [], errors: [] }
-                : {
-                    errors: [
-                        {
-                            severity: clientside_extensions_schema_1.ErrorLevels.ERROR,
-                            error: 'asd',
-                        },
-                    ],
-                    warnings: [],
-                };
-        };
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, { ...options, attributeValidator: localValidate }));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [supportedExtension, wrongTypeExtension], loadingState: false });
-        });
-        const [extensions] = result.current;
-        expect(extensions).toEqual([{ ...applyAttributesProvider(supportedExtension) }]);
-        expect(loggerLogs).toContainEqual(expect.objectContaining({
-            level: clientside_extensions_debug_1.LogLevel.error,
-            message: expect.stringContaining('Schema validation for extension "fake-3" returned errors'),
-        }));
-    });
-    it('should update the attributes when using the ”updateAttributes” function', async () => {
-        const changeAttributesExtension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: { label: 'a fake label' },
-            attributesProvider: ({ updateAttributes }) => ({
-                type: 'button',
-                onAction: () => updateAttributes({ label: 'a new fake label' }),
-            }),
-        };
-        const { result, waitForNextUpdate } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, options));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [changeAttributesExtension], loadingState: false });
-        });
-        react_hooks_1.act(() => {
-            const [extensions] = result.current;
-            const [testExtension] = extensions;
-            testExtension.attributes.onAction();
-        });
-        await waitForNextUpdate();
-        const [extensionsUpdated] = result.current;
-        const [testExtensionChanged] = extensionsUpdated;
-        expect(testExtensionChanged.attributes.label).toBe('a new fake label');
-    });
-    it('should catch errors when calling update attributes API', () => {
-        const brokenUpdateAttributesExtension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: { label: 'a fake label' },
-            attributesProvider: ({ updateAttributes }) => ({
-                type: 'button',
-                onAction: () => updateAttributes(() => {
-                    throw new Error('update attributes error');
-                }),
-            }),
-        };
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, options));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [brokenUpdateAttributesExtension], loadingState: false });
-        });
-        expect(loggerLogs).not.toContainEqual(expect.objectContaining({
-            level: clientside_extensions_debug_1.LogLevel.error,
-        }));
-        react_hooks_1.act(() => {
-            const [extensions] = result.current;
-            const [testExtension] = extensions;
-            testExtension.attributes.onAction();
-        });
-        expect(loggerLogs).toContainEqual(expect.objectContaining({
-            level: clientside_extensions_debug_1.LogLevel.error,
-            message: expect.stringContaining('Updating attributes for extension fake-1 failed'),
-        }));
-        expect(result.error).toBeFalsy();
-    });
-    it('should add new attributes when using `updateAttributes` function', async () => {
-        let localExtensionApi;
-        const extension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: {},
-            attributesProvider: (extensionApi) => {
-                localExtensionApi = extensionApi;
-                return {
-                    type: 'button',
-                };
-            },
-        };
-        const { result, waitForNextUpdate } = react_hooks_1.renderHook(() => useExtensions_1.useExtensions('fake-location', null, options));
-        // First render
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [extension], loadingState: false });
-        });
-        const [extensionFirstRender] = result.current;
-        expect(extensionFirstRender.attributes).not.toHaveProperty('beforeIcon');
-        // Add new attributes
-        react_hooks_1.act(() => localExtensionApi.updateAttributes({
-            beforeIcon: 'my-icon',
-        }));
-        await waitForNextUpdate();
-        const [extensionSecondRender] = result.current;
-        expect(extensionSecondRender.attributes).toHaveProperty('beforeIcon', 'my-icon');
-    });
-    it('should extend the existing attributes when using `updateAttributes` function with a functional update', async () => {
-        let localExtensionApi;
-        const extension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: {},
-            attributesProvider(extensionApi) {
-                localExtensionApi = extensionApi;
-                return {
-                    type: 'button',
-                    label: 'foo',
-                    counter: 0,
-                };
-            },
-        };
-        const { result, waitForNextUpdate } = react_hooks_1.renderHook(() => useExtensions_1.useExtensions('fake-location', null, options));
-        // First render
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [extension], loadingState: false });
-        });
-        expect(result.current[0].attributes).toEqual({
-            type: 'button',
-            label: 'foo',
-            counter: 0,
-        });
-        // First update
-        react_hooks_1.act(() => localExtensionApi.updateAttributes({
-            label: 'bar',
-            counter: 1,
-        }));
-        await waitForNextUpdate();
-        expect(result.current[0].attributes).toEqual({
-            type: 'button',
-            label: 'bar',
-            counter: 1,
-        });
-        // Second update with manual attributes merge
-        react_hooks_1.act(() => localExtensionApi.updateAttributes((prevAttributes) => {
-            return {
-                ...prevAttributes,
-                label: 'baz',
-                counter: prevAttributes.counter ? prevAttributes.counter + 1 : 1,
-            };
-        }));
-        await waitForNextUpdate();
-        expect(result.current[0].attributes).toEqual({
-            type: 'button',
-            label: 'baz',
-            counter: 2,
-        });
-        // Third update with auto-merge
-        react_hooks_1.act(() => localExtensionApi.updateAttributes((prevAttributes) => ({
-            counter: prevAttributes.counter ? prevAttributes.counter * 2 : 2,
-        })));
-        await waitForNextUpdate();
-        expect(result.current[0].attributes).toEqual({
-            type: 'button',
-            label: 'baz',
-            counter: 4,
-        });
-    });
-    it('should provide a clean up API that gets called when the extension point updates', async () => {
-        const cleanupSpy = jest.fn();
-        const cleanupExtension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: { label: 'a fake label' },
-            attributesProvider: ({ onCleanup }) => {
-                onCleanup(cleanupSpy);
-                return {
-                    type: 'button',
-                };
-            },
-        };
-        // eslint-disable-next-line @typescript-eslint/no-shadow
-        const { rerender } = react_hooks_1.renderHook(({ name, context, options }) => useExtensions_1.useExtensionsAll(name, context, options), {
-            initialProps: {
-                name: 'fake-location',
-                context: {
-                    value: 1,
-                },
-                options,
-            },
-        });
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [cleanupExtension], loadingState: false });
-        });
-        rerender({
-            name: 'fake-location',
-            context: {
-                value: 3,
-            },
-            options,
-        });
-        expect(cleanupSpy).toBeCalledTimes(1);
-        // TODO: unmounting the hook should call the cleanup callbacks, but it isn't.
-        // unmount();
-        // expect(cleanupSpy).toBeCalledTimes(2);
-    });
-    it('should catch errors when calling onCleanup API', () => {
-        const cleanupSpy = jest.fn(() => {
-            throw new Error('clean up error');
-        });
-        const cleanupExtension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: { label: 'a fake label' },
-            attributesProvider: ({ onCleanup }) => {
-                onCleanup(cleanupSpy);
-                return {
-                    type: 'button',
-                };
-            },
-        };
-        // eslint-disable-next-line @typescript-eslint/no-shadow
-        const { rerender } = react_hooks_1.renderHook(({ name, context, options }) => useExtensions_1.useExtensionsAll(name, context, options), {
-            initialProps: {
-                name: 'fake-location',
-                context: {
-                    value: 1,
-                },
-                options,
-            },
-        });
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [cleanupExtension], loadingState: false });
-        });
-        rerender({
-            name: 'fake-location',
-            context: {
-                value: 3,
-            },
-            options,
-        });
-        expect(cleanupSpy).toBeCalledTimes(1);
-        expect(loggerLogs).toContainEqual(expect.objectContaining({
-            level: clientside_extensions_debug_1.LogLevel.error,
-            message: expect.stringContaining('Failed to execute cleanup callback'),
-        }));
-    });
-    it('should catch error when calling the attributes provider', () => {
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, options));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [supportedExtension, brokenExtension], loadingState: false });
-        });
-        const [extensions] = result.current;
-        expect(extensions).toEqual([{ ...applyAttributesProvider(supportedExtension) }]);
-        expect(loggerLogs).toContainEqual(expect.objectContaining({
-            level: clientside_extensions_debug_1.LogLevel.error,
-            message: expect.stringContaining('Calling the attributes provider for extension fake-4 failed'),
-        }));
-    });
-    it('should safe guard onAction attributes to prevent them from breaking the app when executed', () => {
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, options));
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [brokenOnActionExtension], loadingState: false });
-        });
-        const [extensions] = result.current;
-        const [buttonExtension] = extensions;
-        expect(buttonExtension.attributes.onAction).not.toThrow();
-    });
-    it('should throw an error if no context schema is provided when providing context', () => {
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', { info: 'test-info' }, { attributeValidator }));
-        expect(result.error).toEqual(Error('No context validator specified for extension point "fake-location"'));
-    });
-    it('should call the attributes provider only once when passed context did not changed', () => {
-        const stableContext = {
-            foo: 'bar',
-        };
-        const attributesExtension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: {
-                type: 'button',
-            },
-            attributesProvider: (_, context) => ({
-                context,
-            }),
-        };
-        const { result, rerender } = react_hooks_1.renderHook(({ context }) => useExtensions_1.useExtensionsAll('fake-location', context, options));
-        // First call
-        rerender({
-            context: stableContext,
-        });
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [attributesExtension], loadingState: false });
-        });
-        const [supportedDescriptorsFirstUpdate] = result.current;
-        const [{ attributes: attributesFirstUpdate }] = supportedDescriptorsFirstUpdate;
-        expect(attributesFirstUpdate.context).toBe(stableContext);
-        // Second call
-        rerender({
-            context: stableContext,
-        });
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [attributesExtension], loadingState: false });
-        });
-        const [supportedDescriptorsSecondUpdate] = result.current;
-        const [{ attributes: attributesSecondUpdate }] = supportedDescriptorsSecondUpdate;
-        expect(attributesSecondUpdate.context).toBe(stableContext);
-        expect(utils_1.mocked(clientside_extensions_registry_1.default.getLocation)).toHaveBeenCalledTimes(1);
-    });
-    it('should call the attributes provider twice when passed context did changed', () => {
-        const firstContext = {
-            foo: 'bar',
-        };
-        const secondContext = {
-            biz: 'baz',
-        };
-        const attributesExtension = {
-            key: 'fake-1',
-            location: 'fake-location',
-            weight: 10,
-            attributes: {
-                type: 'button',
-            },
-            attributesProvider: (_, context) => ({
-                context,
-            }),
-        };
-        const { result, rerender } = react_hooks_1.renderHook(({ context }) => useExtensions_1.useExtensionsAll('fake-location', context, options));
-        // First update
-        rerender({
-            context: firstContext,
-        });
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [attributesExtension], loadingState: false });
-        });
-        const [supportedDescriptorsFirstUpdate] = result.current;
-        const [{ attributes: attributesFirstUpdate }] = supportedDescriptorsFirstUpdate;
-        expect(attributesFirstUpdate.context).toBe(firstContext);
-        // Second update
-        rerender({
-            context: secondContext,
-        });
-        react_hooks_1.act(() => {
-            locationObserver({ descriptors: [attributesExtension], loadingState: false });
-        });
-        const [supportedDescriptorsSecondUpdate] = result.current;
-        const [{ attributes: attributesSecondUpdate }] = supportedDescriptorsSecondUpdate;
-        expect(attributesSecondUpdate.context).toBe(secondContext);
-        expect(utils_1.mocked(clientside_extensions_registry_1.default.getLocation)).toHaveBeenCalledTimes(2);
-    });
-    it('should log an error when attributes provider did return a non-supported value', () => {
-        const { result } = react_hooks_1.renderHook(() => useExtensions_1.useExtensionsAll('fake-location', null, options));
-        const firstExtension = {
-            key: 'first',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error - Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return null;
-            },
-        };
-        const secondExtension = {
-            key: 'second',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error - Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return false;
-            },
-        };
-        const thirdExtension = {
-            key: 'third',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error - Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return -Infinity;
-            },
-        };
-        const fourthExtension = {
-            key: 'fourth',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error - Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return () => { };
-            },
-        };
-        const fifthExtension = {
-            key: 'fifth',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error - Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return [];
-            },
-        };
-        const sixthExtension = {
-            key: 'sixth',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error - Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return '';
-            },
-        };
-        const seventhExtension = {
-            key: 'seventh',
-            location: 'fake-location',
-            weight: 0,
-            attributes: {},
-            // @ts-expect-error -  Ignore the type since we don't know what extension developer might return in the runtime
-            attributesProvider() {
-                return undefined;
-            },
-        };
-        const descriptors = [
-            firstExtension,
-            secondExtension,
-            thirdExtension,
-            fourthExtension,
-            fifthExtension,
-            sixthExtension,
-            seventhExtension,
-        ];
-        react_hooks_1.act(() => {
-            locationObserver({
-                descriptors,
-                loadingState: false,
-            });
-        });
-        const [extensions] = result.current;
-        expect(extensions).toHaveLength(0);
-        const errors = loggerLogs.filter((log) => log.level === clientside_extensions_debug_1.LogLevel.error);
-        expect(errors).toHaveLength(7);
-    });
-});
-//# sourceMappingURL=useExtensions.test.js.map