SOLVED: Jest Testing Aurelia Components with jQuery and SignalR

Help Requests
1

I’m trying to get Jest setup and working with my Aurelia project. The Aurelia project was built from the CLI with Jest included. I have some components that rely on jQuery and SignalR that are causing the test suite to fail. I’ve tried some different methods to include jQuery in the Jest testing environment, but none of the methods I’ve found have been able to get the test suite to run successfully. Without attempting to include jQuery with Jest, running the tests throws this error:

  console.error
    Error: jQuery was not found. Please ensure jQuery is referenced before the SignalR client JavaScript file.
        at C:\Users\danev\source\repos\alliance_horizon\AllCall.Web.Server\Client\node_modules\signalr\jquery.signalR.js:50:15

I tried to include jQuery with my Jest setup by change my jest-pretest.ts file to look like this:

Screenshot 2021-02-26 152516

However, this still throws an error and doesn’t allow the test suite to run successfully:

test/jest-pretest.ts:22:8 - error TS2339: Property '$' does not exist on type 'Window & typeof globalThis'.

22 window.$ = window.jQuery = $;
          ~
test/jest-pretest.ts:22:19 - error TS2339: Property 'jQuery' does not exist on type 'Window & typeof globalThis'.

22 window.$ = window.jQuery = $;

If anyone has any experience working with SignalR, jQuery, and Jest together and has any ideas on what to try, please share!

Thanks in advance!

2

I use it like this

globalize();

// import jQuery AFTER globalize() is the only way to get the test working
import * as jQuery from 'jquery';

(global as any).$ = (global as any).jQuery = jQuery;
(window as any).$ = (window as any).jQuery = jQuery;

Here’s my Jest pretest setup file

1 Like
3

Thanks @ghiscoding! Putting the import and everything else after the globalize() got it working.

1 Like
4

glad to know I’m not the only one, and that is why I left a comment in my code because I actually forgot about that lol. Happy to hear it fixed your issue… Happy Coding :wink:

1 Like