Angular 2 y jQuery – ¿Cómo probar?

Estoy usando Angular-CLI (versión webpack) para mi proyecto Angular 2 y también necesito usar jQuery (por desgracia. En mi caso, es una dependencia de Semantic-UI y lo estoy usando para manejar los menús desplegables).

La forma en que lo estoy usando:

npm install jquery --save 

Luego listando en su archivo angular-cli.json en la matriz de scripts :

 scripts": [ "../node_modules/jquery/dist/jquery.min.js" ] 

Por lo tanto, se incluye en el archivo de paquete y este archivo se usa automáticamente para rootear el archivo html:

Luego declare var $: any; En archivos donde lo necesito y funciona bien.

Sin embargo, hay un problema con las ng test , ya que Karma arroja un error $ is not defined .

Esto se debe a que el archivo html de prueba, proporcionado por Karma, no incluye el archivo scripts.bundle.js como lo hace la versión normalmente servida.

La solución es fácil; simplemente incluye la misma ruta al archivo jquery en el archivo karma.config.js en la carpeta raíz del proyecto. Este archivo está disponible en la raíz del proyecto.

En la matriz de files , agregue la ruta con la watched como esta:

 files: [ { pattern: './node_modules/jquery/dist/jquery.min.js', watched: false }, { pattern: './src/test.ts', watched: false } ] 

Karma ahora debe saber sobre la dependencia jQuery.