Jasmine tests with Angular 2 and Node not working - node.js

I have installed the ng-fullstack generator and selected the options for Angular 2 and Node. Everything plays nicely... apart from the tests. When I try to execute the tests they fail. Any search I have done tells me what a downgrade of zone.js to 0.6.2 will solve the problem, however, I cannot downgrade as Angular 2 requires a later version of Zone.js, so I'm a bit stuck:
#angular/core#2.4.2 requires a peer of zone.js#^0.7.2 but none was installed.
Points to note, when I first install the generator, it installs a lower version of zone.js - a version that would be compatible with getting the tests to work (according to my Googling). If I execute the tests with zone.js#^0.7.2 I see this error:
Chrome 55.0.2883 (Mac OS X 10.12.2) ERROR
Uncaught Error: Missing: SyncTestZoneSpec
at node_modules/zone.js/dist/jasmine-patch.js:43
10 01 2017 15:34:26.123:WARN [web-server]: 404: /base/node_modules/#angular/core/testing.js
10 01 2017 15:34:26.126:WARN [web-server]: 404: /base/node_modules/#angular/platform-browser-dynamic/testing.js
[15:34:26] 'client.unit_test' errored after 2.47 s
Does anyone have any suggestions of how I can get my Jasmine tests to work? I'm a bit stumped with this one. Thanks in advance!

you should load all zone related files in your test config file.
for example, if you use karma, you should include
'node_modules/zone.js/dist/zone.js',
'node_modules/zone.js/dist/long-stack-trace-zone.js',
'node_modules/zone.js/dist/proxy.js',
'node_modules/zone.js/dist/sync-test.js',
'node_modules/zone.js/dist/jasmine-patch.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js'
in karma.conf.js files block.
if you use node, you should also have a polyfill file which define all the files will be loaded before test begin, so put the above files in that polyfill file.

Related

Angular custom library module not found after updating to version 15

I have updated my custom library and UI Angular applications to version 15 but now when I try to run "ng serve" it says it can't find the module for my custom library. We are working with Artifactory for our repositorys. And I noticed that since I updated the Jenkins build to use Node 16 it packages the npm package differently.
So I'm curious if anyone has come across this before. I was able to consume the library without any issues when it was version 11, but after the update to 15 I get the following error.
Error: Module not found: Error: Can't resolve '#cto_compliance_amf/amf-library' in 'C:\Users\zkafpf7\Documents\MyProjects\amf_ui\src\app'
Any and all help is appreciated.
Turns out that when I updated to Node 16 for the Jenkins build, the babel script wasn't working correctly. I updated my pre-pack script to use shx instead of babel to move the files from the dist folder to the root folder. Then updated the .npmignore file to omit the files that weren't needed in the package. And now everything works. Hope this helps someone else.

Node error when I run npm with laravel breeze

I have this error when I run npm run dev or npm run watch and I didn't find what is the mess. It's happens in a all fresh Laravel 8 app.
It looks like happen when I use the developement command
ERROR in ./resources/css/app.css
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):
TypeError: [(...variantsValue),(...extensions)].flat is not a function
at /var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:219:73
at baseMergeDeep (/var/www/html/smart_recipe/node_modules/lodash/_baseMergeDeep.js:42:7)
at /var/www/html/smart_recipe/node_modules/lodash/_baseMerge.js:27:7
at /var/www/html/smart_recipe/node_modules/lodash/_createBaseFor.js:17:11
at baseMerge (/var/www/html/smart_recipe/node_modules/lodash/_baseMerge.js:24:3)
at /var/www/html/smart_recipe/node_modules/lodash/mergeWith.js:36:3
at /var/www/html/smart_recipe/node_modules/lodash/_createAssigner.js:30:9
at apply (/var/www/html/smart_recipe/node_modules/lodash/_apply.js:15:25)
at /var/www/html/smart_recipe/node_modules/lodash/_overRest.js:32:12
at mergeVariantExtensions (/var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:218:33)
at resolveVariants (/var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:235:10)
at resolveConfig (/var/www/html/smart_recipe/node_modules/tailwindcss/lib/util/resolveConfig.js:271:15)
at /var/www/html/smart_recipe/node_modules/tailwindcss/lib/index.js:77:37
at /var/www/html/smart_recipe/node_modules/tailwindcss/lib/processTailwindFeatures.js:52:20
at LazyResult.run (/var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:288:14)
at LazyResult.asyncTick (/var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:212:26)
at LazyResult.asyncTick (/var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:225:14)
at /var/www/html/smart_recipe/node_modules/postcss/lib/lazy-result.js:217:17
at runLoaders (/var/www/html/smart_recipe/node_modules/webpack/lib/NormalModule.js:316:20)
at /var/www/html/smart_recipe/node_modules/loader-runner/lib/LoaderRunner.js:367:11
at /var/www/html/smart_recipe/node_modules/loader-runner/lib/LoaderRunner.js:233:18
at context.callback (/var/www/html/smart_recipe/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at Promise.resolve.then.then.catch (/var/www/html/smart_recipe/node_modules/postcss-loader/src/index.js:208:9)
# ./resources/css/app.css
I came across same issue and spent 5 hours on finding solution but could not.
After searching alot, I came across this
"Tailwind CSS v2.0 no longer supports Node.js 8 or 10. To build your CSS you'll need to ensure you are running Node.js 12.13.0 or higher in both your local and CI environments."
at https://tailwindcss.com/docs/upgrading-to-v2
So I realized that issue was in my Node version which was 10.x so
I uninstalled Node from my windows machine and downloaded LTS version (14.x).
So consider updating your Node version, it will solve the issue as it did work for me.
There is possibility that old node versions don't have that flat function that Tailwind CSS 2 has implemented and that's throwing error.
I Had the exact same issue after installing Breeze... Unfortunately the npm error message gives no clue of what is really going on !
Thanks to #DaniyalGondal I found out that my node version was raising the error because of tailwind V2 requirements (https://tailwindcss.com/docs/upgrading-to-v2) that comes with Breeze... So I did upgrade my node version using : sudo n latest under ubuntu20
Don't forget to restart your terminal after upgrading and check that your node is correctly upgraded using : node --version
If the node version is above 12.13.0, now npm run watch or npm run dev should work fine !

Node Sass error in Angular: Mixins may not be defined within control directives or other mixins

I have a project written in Angular 4 and I am trying to build it, but I keep getting this error: Mixins may not be defined within control directives or other mixins.
I've looked around on the internet and I saw some recommendations to downgrade node-sass to the version 4.8.1, but when I tried to do this, I got a 404 erro from Github:
> node-sass#4.8.1 install c:\my-project\node_modules\node-sass
> node scripts/install.js
Downloading binary from https://github.com/sass/node-sass/releases/download/v4.8.1/win32-x64-64_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.8.1/win32-x64-64_binding.node":
HTTP error 404 Not Found
And sure enough, this address: https://github.com/sass/node-sass/releases/download/v4.8.1/win32-x64-64_binding.node doesn't exists. My guess is because there are new versions of node-sass available and the 4.8.1 was pushed back to the second page: https://github.com/sass/node-sass/releases?after=3.5.3.
I know that I am using a very old version of Angular and I have plans to upgrade it, but I don't have the time to do this now, has someone managed to solve this?
Download win32-x64-64_binding.node, put in the local:
C:\Users\{username}\AppData\Roaming\npm-cache\node-sass\4.8.1\
Then install again.

Error: Module version mismatch. Expected 47, got 48

I'm writing a Visual Studio Code extension which uses a native node.js module. When I try to debug this extension in vscode I get the error message from above, when loading the native module (when commenting out the require() call no error comes up). It tried quite a few steps to overcome + test this:
npm uninstall native-module followed by a npm install native-module --save-dev in my vscode extension folder, this compiled the native module completely and without problems.
Completely cleaned my node_modules folder in the extension and did again the npm install --save-dev.
Installed node.js again, both LTS and current. With LTS the error message changes to: expected 47, got 46.
Installed latest vscode (August recovery build)
Launched a node session in my vscode extension folder and loaded my native module. This works nicely.
Read the various questions and comments here on SO. They mostly recommend what I described above.
Still, I cannot get vscode to accept my native module. What can I do? From the above steps it appears as if vscode has been built with a node.js version between current and LTS. Can I force my native module somehow to use a specific version?
Btw. what do those numbers 48, 47, 46 etc. actually mean? The node.js version is of course in the typical form: major.minor.build and nothing of that matches the above version numbers.
Update:
ok, I found what those numbers mean: https://nodejs.org/en/download/releases/
Once you know what those numbers in the error message mean it's easy to solve the issue. Simply install the node.js version that is expected. In my case it's node.js 5.12.0.
Remove node_modules folder
Run npm update
Then;
Run npm install

Karma Unit Testing

I'm having trouble trying to figure out the reason for this error when trying to start karma:
bash-3.2$ NODE_ENV=test karma start
INFO [karma]: Karma v0.12.31 server started at http://localhost:9876/
INFO [launcher]: Starting browser PhantomJS
INFO [PhantomJS 1.9.8 (Mac OS X)]: Connected on socket FONtQ1oNxIxRecRxYgnS with id 73511945
PhantomJS 1.9.8 (Mac OS X) ERROR
ReferenceError: Can't find variable: require
at /public/components/angular-cookies/index.js:1
The index.js file contains:
require('./angular-cookies');
module.exports = 'ngCookies';
Please help!!
One way to fix this is to npm install karma-browserify --save-dev. That should work and you will have to do that if the actual file you need uses require.
index.js is not the actual file you need. angular-cookies.js is.
I find that using browserify makes debugging test errors more difficult because the stack trace you get from karma would refer to line numbers from temporary .browserify bundles that already got deleted by the time your test is done.
A simple solution is to point files in karma.conf.js directly to angular-cookies.js instead of using wildcards. This way, index.js and its usage of require will not cause unnecessary issue.
require is nodejs feature
try install this karma-browserify, it allow you to use "require"
Try adding browserify as a
preprocessor:
'test/**/*.js': ['browserify']
and add it to your frameworks

Resources