Tengo un componente React que escucha el evento beforeinstallprompt para manejar la instalación de la aplicación PWA. Tiene un gancho de efecto como este:
useEffect(() => { window.addEventListener('beforeinstallprompt', handleBeforeInstallPromptEvent); return () => { window.removeEventListener('beforeinstallprompt', handleBeforeInstallPromptEvent); }; }, [handleBeforeInstallPromptEvent]); El controlador handleBeforeInstallPromptEvent hace algo de lógica para mostrar un banner que le pide al usuario que instale la aplicación si aún no se ha instalado.
Para probar este comportamiento, creé esta prueba de broma, pero no está llamando al controlador de eventos y, en consecuencia, no muestra la alerta.
¿Me estoy perdiendo de algo?
it('should render install app alert if not yet installed', async () => { const event = createEvent('beforeinstallprompt', window, { userChoice: new Promise((res) => res({ outcome: 'accepted', platform: '' })), prompt: () => new Promise((res) => res(undefined)), }); render(<InstallApp />); await act(async () => { fireEvent(window, event); }); expect(screen.getByText(/Install app!/g)).toBeVisible(); });Encontré el problema. El bloque de prueba describe tiene esta configuración de instalación/desmontaje que impide que los eventos sean capturados
beforeAll(() => { window.addEventListener = jest.fn(); window.removeEventListener = jest.fn(); }); afterAll(() => { (window.addEventListener as any).mockClear(); (window.removeEventListener as any).mockClear(); });