Karma tests error "unable to init ocLazyLoad" - javascript

From the quickstart sb-admin-angular, I am trying to run the tests, but I get the error unable to init ocLazyLoad. (This is a Windows7 machine.)
The command I use to run the tests is:
$ grunt test --force
I understand from this thread that I must make sure that the path to the ocLazyLoad script is added in karma.conf.js.
files: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
...
'bower_components/oclazyload/dist/ocLazyLoad.min.js',
'app/scripts/**/*.js',
'test/mock/**/*.js',
'test/spec/**/*.js'
],
I have also tried using Bower to reinstall ocLacyLoad, as suggested in the aforementioned thread. I was given a choice of versions and selected the first option:
Unable to find a suitable version for oclazyload, please choose one:
1) oclazyload#~0.5.2 which resolved to 0.5.2 and is required by sb-admin
2) oclazyload#^1.0.9 which resolved to 1.0.9
What step am I missing or corrupting here, please?

I would update oclazyload in bower.json file to version 0.6.0 or higher. Some 0.5.x version introduced this bug and it is solved at 0.6.0 version on.
Current value on bower.json value of the example was 0.5.2 which you used, too.
References:
[1] https://github.com/ocombe/ocLazyLoad/issues/122 (issue in GitHub)

It looks like this is what you are experiencing:
Error in karma testing
This should be fixed in ocLazyLoad 0.6.0.

Related

Error when update #adonisjs/ally version 2.1.3 to 4.1.3

After I updated #adonisjs/ally version from 2.1.3 to 4.1.3 and then I got error Cannot find module 'Model. I comment AllyProvider line and run again, It's not error but I can't login both facebook and google. I'm not sure, I do something wrong. (I use adonis 4.1.0) Thank for your suggestion. I spend many time for update adonisjs ally version to 4.1.3
An error that I got.
I comment access provider ally in app.js
In my package.json
Check in the folder "node_modules" > "ally" if there is a folder "providers", if not, check if there is a folder "build" and check if inside it there is a folder "provider" and inside the file "AllyProvider.js" .
After confirming this folder structure, just change the code in "start/app.js" inside "const providers = {...}"
from: '#adonisjs/ally/providers/AllyProvider'
to: '#adonisjs/ally/build/providers/AllyProvider',
If it doesn't work, I advise you to remove the package and install it on version 2.1.3 which will work correctly with this configuration: '#adonisjs/ally/providers/AllyProvider'

Jest "No tests found, exiting with code 1" error on Windows 10 in React Redux application

I am attempting to run Jest on my project. I am on a Windows 10. I only have one test in one test file.
In package.json:
"test": "jest"
My directory structure:
src/
app/
routeName/
redux/
action.tests.js
My output:
No tests found, exiting with code 1
Run with `--passWithNoTests` to exit with code 0
In C:\Users\myUsername\Documents\myApp
47 files checked.
testMatch: **/__tests__/**/*.[jt]s?(x), **/?(*.)+(spec|test).[tj]s?(x) - 0 matches
testPathIgnorePatterns: \\node_modules\\ - 47 matches
testRegex: - 0 matches
Pattern: - 0 matches
npm ERR! Test failed. See above for more details.
According to the documentation here, Jest should look for anything that has test.js in the name.
I have also tried tests.js and that didn't work either.
I created a folder in the root of the project and put a test in there as __tests__/tests.js and that did work, but I do not want it placed there.
I have seen several tickets and questions about questions that are superficially similar, but all of those involve more complex configurations, or bugs that were supposedly patched already. I have no special configurations set. The documentation says this should work. Tutorials I have read for Jest include the exact setup I am currently using.
I am using Babel and Webpack. I installed the jest and babel-jest packages. I also added jest to the ESLint environment.
[edit] updated to properly document my problem, which I answered below. I lost track of my file naming.
I am a bloody idiot and I didn't pay attention to the details.
Jest is looking for test.js specifically. Not testS.js. My files were labeled as tests.js. It worked inside __tests__/ because Jest just looks for anything inside there.
I got it working just fine now, and it shall remain up as a testament to me not looking at the specifics of the regex matches.
I had the same Problem with a React-App. Make sure, that the jest config file has the correct file pattern to find the tests:
// jest.config.js
module.exports = {
testMatch: [
'<rootDir>/src/**/*.test.js',
'<rootDir>/src/**/*.test.jsx',
],
...
}
From my side, I was getting this error because I had placed myself (cd) in the directory where the chromeDriver was installed, so as not to have to add its path to $Path. After I added chromeDriver to $Path, and placed myself in the directory of my project, everything went fine.
No tests found, exiting with code 1
All I had to do was npm install.
Then I hit the Debug link at the top of my test. The test was found and execution stopped at the breakpoint. A simple solution to a very frustrating problem.
You just need to change the name of the file. For example
if you have a customer.js or customer.ts file and you want to test it. Create a new file name is customer.test.js or
customer.test.ts after npm test it will test the file which just for testing .
I had the same problem, I wanted to run my tests inside drone CI pipeline and had the same error what solved my problem was simply adding workspace to my project.
check if it is small case like filename.test.js.
I made a mistake ComponentName.Test.js and got error, fixed it by ComponetName.test.js

Bootstrap v4 runtime/load error in Aurelia

I have the following in my aurelia.json file, among the rest of what you'd usually find. I copied it directly from the reference implementation, and as you'd therefore expect, it works fine.
{
'build': {
'bundles': [
'name': 'vendor-bundle.js'
'dependencies': [
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": ["jquery"],
"exports": "$",
"resources": [
"css/bootstrap.css"
]
}
]
]
}
}
However, I'm trying to migrate to Bootstrap 4, and it just doesn't seem to be working. In order to update the package, I've tried changing build.bundles.dependencies[].path to ../jspm_packages/github/twbs/bootstrap#4.0.0-beta as well as to ../node_modules/bootstrap-v4-dev/dist, but it doesn't change the error code or make the error manifest any less. I've also tried copying the v4 files into the dist folder for v3, which also causes the same problem.
Build is always clean; the error occurs at run-time:
DEBUG [templating] importing resources for app.html
Uncaught TypeError: plugin.load is not a function
Unhandled rejection Error: Failed loading required CSS file: bootstrap/css/bootstrap.css
EDIT:
Thanks to Ashley Grant's answer, I have updated Bootstrap through NPM, obviating any changes to aurelia.json. The error remains unchanged, which would seem to indicate a bug were it not for the fact that other people have successfully performed this migration without errors using the same toolchain.
EDIT2:
I've created steps to reproduce the bug:
$ au new
name # can be any valid value
2 # Selects TypeScript as the language
1 # Create project structure
1 # Install dependencies
cd into the project directory.
Add the two entries listed above to build.bundles[1].dependencies in aurelia_project/aurelia.json
$ npm install jquery --save
$ npm install bootstrap#^4.0.0-beta --save
Change src/app.html to the following:
<template>
<require from="bootstrap/css/bootstrap.css"></require>
</template>
Finally, execute either of the following and browse to the provided URL.
$ au run
OR
$ au build
$ serve
This yields the errors described in both Google Chrome Version 55.0.2883.87 (64-bit) and Mozilla Firefox 55.0.3 on my Arch Linux systems. I've not yet had the opportunity to test it on other systems.
Edit3:
Thanks to #vidriduch, everything appears to be working. However, if you look at the console, you find the following:
Uncaught SyntaxError: Unexpected token export
vendor-bundle.js:3927Uncaught Error: Mismatched anonymous define() module: [entirety of vendor-bundle.js printed here]
These are the two very first messages when the page loads in debug mode, but no other errors arise.
You are missing popper.js dependency for Bootstrap 4.0.0-beta.
In order for Aurelia to accept this add
"node_modules/popper.js/dist/umd/popper.js"
on the top (as per comment from #hxtk) of prepend part of aurelia.json (assuming that you are using RequireJS, otherwise have a look at webpack dependency linking for Bootstrap https://getbootstrap.com/docs/4.0/getting-started/webpack/)
Just to mention, the version of popper.js you need to install is 1.11.0 (https://github.com/twbs/bootstrap/issues/23381), so
npm install popper.js#1.11.0
or
yarn add popper.js#1.11.0
and it should work :)
Your aurelia.json configuration is correct. I'm going to guess you never ran npm install bootstrap#^4.0.0-beta --save as you are mentioning copying files in to a versioned node_modules folder, and NPM doesn't use versioned folders like JSPM does.
So run npm install bootstrap#^4.0.0-beta --save and things should start working. I have your exact configuration working in an application for one of my clients.

Hyperterm Cannot find module error, when installing plugins

I've installed a few plugins, but getting an error with hyperterm-transparent-bg
plugins: [
'hyperterm-material',
'hyperterm-transparent-bg',
'hyperterm-blink'
],
The following don't work, and I keep getting a Cannot find module error, even though my paths are correct.
hyperterm-transparent-bg
bundle.js:1 Error: Cannot find module '/Users/leongaban/.hyper_plugins/node_modules/hyperterm-transparent-bg'
at Module._resolveFilename (module.js:455:15)
I re-installed Hyperterm and it doesn't look like it can rebuild the npm-debug.log file :(
Here is the gist to the last one I had saved off.
Try setting the shell property in .hyper.js .
I have been having the same issue and got it fixed by setting the shell property after reading this https://github.com/zeit/hyper/issues/1513#issuecomment-281414846
Thanks to this answer in their repo: https://github.com/dfrankland/hyper-transparent-bg/issues/9#issuecomment-284415902
Apparently it changed to this plugin instead: https://www.npmjs.com/package/hyper-transparent
I used yarn instead of npm to install it: yarn add npm i hyper-transparent
Then in my .hyper.js config:
plugins: [
'hyperterm-material',
'hyperterm-blink',
'hyper-transparent'
]
Got it working! Took me a sec to realize that the transparency controls where in the view menu of the OSX toolbar.

How to create aurelia typescript project with vs2017rc

I am new to aurelia, and I need create a prototype project of the framework. At the beginning, I planed to use skeleton-typescript-aspnetcore skeleton, but when I tried the vs2017rc, I found it uses .csproj as the default format(while vs2015 is project.json/.xproj), I think we should follow the vs2017 because we will upgrade our IDE after it's been launched.
The vs2017 have a wizard to upgrade .xproj project, but after the upgrading(skeleton-typescript-aspnetcore), there still lots of error ahead me...
I also tried aurelia-cli, but seems it has not support vs2017 yet, does anyone could give a guide to create the prototype project? I will integrate some plugins like the skeleton mentioned above, such as gulp,karma,breeze...
thank you in advance.
Since Visual Studio 2017 just launched I thought I'd answer how I solved this, as there are still many errors when using "skeleton-typescript-aspnetcore".
Using https://github.com/aurelia/skeleton-navigation/releases/tag/1.1.2 as a starting point, these are the steps to get it running:
When you first run the project you will get errors complaining that some files located in /test/ is not under 'rootDir'. In your tsconfig.json the rootDir is defined as "src/", this can be solved simply by moving your test folder inside your src folder. This will cause new errors because the paths defined in those files has now changed. You will need to edit app, child-router and users imports like this:
import {Users} from '../../users'; IntelliSense should help you out here.
The command gulp test will also not run before changing to the new path, you can change the path in karma.conf.js:
files: [
'src/test/unit/setup.ts',
'src/test/unit/*.ts'
],
Next the file users.ts will throw errors like Type 'Response' is not assignable to type 'any[]'. You will need to tell TypeScript what you're declaring like this: public users : Object = []; or simply: public users = {};
The final problem is that you're going to have a lot of duplicate identifier errors, at the time of writing this the cause of this seems to be from the changes brought on by TypeScript version 2.2.1. I don't know what specifically breaks, but I know that previous version 2.1.5 still works. So what you need to do is to run npm install typescript#2.1.5 --save in your src/skeleton directory, the --save is just to update your package.json file, you can do this on your own later as well if you wish.
After you've done that your gulp errors (20~ of them) should be resolved. But there are still some errors remaining caused by duplicate signatures. Again, things have changed in TypeScript 2.0+, there is now a simplified way of getting and using declaration files. Here is an answer on SO on how to use the #types feature: How should I use #types with TypeScript 2 , but to keep this short and sweet you will have to go to your tsconfig.json file and explicitly tell where to find the #types/node folder. It would look something like this:
"compilerOptions": {
...
"typeRoots": [
"node_modules/#types"
],
"types": [ "node" ]
...
},
Hope this helps, with these changes the project should now build and launch correctly.
EDIT:
I recently ran into some problems again with building my project. I got a lot of duplicate identifiers again... I however ran across this answer on SO: TypeScript throws multiple duplicate identifiers
Apparently TypeScript latest ships with fetch definitions out of the box, so I was able to run the command from the answer in the link:
npm uninstall #types/whatwg-fetch
And upgrading from typescript 2.1.5 to latest:
npm install typescript --save
You might even want to install typescript globally by appending -g.
Also this will continue to be an issue unless you comment out/delete url and whatwg-fetch from typings.json globalDependencies in order to prevent it from recreating itself:
"globalDependencies": {
//"url": "github:aurelia/fetch-client/doc/url.d.ts#bbe0777ef710d889a05759a65fa2c9c3865fc618",
//"whatwg-fetch": "registry:dt/whatwg-fetch#0.0.0+20160524142046"
}
Then you can either delete the typings folder, running typings install again or edit index.d.ts in the typings folder and delete the reference paths to whatwg-fetch and url.
Hope this helps someone who might've encountered the same problems even after "fixing" it.

Categories

Resources