npm loads a version of a package (angularfire2) different from the one specified in package.json - npm

I am trying to create a new development environment for an app using angularfire2 package, downloading the source code from a repository.
The package.json file points to version 2.0.0-beta.6 of angularfire2, as in the following snippet
{
"name": "blah blah",
"author": "blah blah",
...
"dependencies": {
....
"angularfire2": "^2.0.0-beta.6",
...
}
.....
}
I run npm install to download all the packages I need.
Unfortunately, in case of angularfire2, what gets downloaded seems to be a different version of the package (probably 2.0.0-beta.8) which has several breaking changes with respect to version 2.0.0-beta.6.
How is this possible?
The package.json file within the angularfire2 directory (under node_modules) is the following
{
"_args": [
[
{
"raw": "angularfire2#^2.0.0-beta.6",
"scope": null,
"escapedName": "angularfire2",
"name": "angularfire2",
"rawSpec": "^2.0.0-beta.6",
"spec": ">=2.0.0-beta.6 <3.0.0",
"type": "range"
},
"/Users/penrico/ThoughWorks/code/angular/castella"
]
],
"_from": "angularfire2#>=2.0.0-beta.6 <3.0.0",
"_id": "angularfire2#2.0.0-beta.8",
"_inCache": true,
"_location": "/angularfire2",
"_nodeVersion": "6.9.1",
"_npmOperationalInternal": {
"host": "packages-18-east.internal.npmjs.com",
"tmp": "tmp/angularfire2-2.0.0-beta.8.tgz_1487250058126_0.7350442344322801"
},
"_npmUser": {
"name": "davideast",
"email": "dceast#gmail.com"
},
"_npmVersion": "3.10.8",
"_phantomChildren": {},
"_requested": {
"raw": "angularfire2#^2.0.0-beta.6",
"scope": null,
"escapedName": "angularfire2",
"name": "angularfire2",
"rawSpec": "^2.0.0-beta.6",
"spec": ">=2.0.0-beta.6 <3.0.0",
"type": "range"
},
"_requiredBy": [
"/"
],
"_resolved": "https://registry.npmjs.org/angularfire2/-/angularfire2-2.0.0-beta.8.tgz",
"_shasum": "8ec172ff17448c3ccdb79e9c6179da556ff05e1b",
"_shrinkwrap": null,
"_spec": "angularfire2#^2.0.0-beta.6",
"_where": "/Users/penrico/ThoughWorks/code/angular/castella",
"author": {
"name": "jeffbcross,davideast"
},
"bugs": {
"url": "https://github.com/angular/angularfire2/issues"
},
"dependencies": {},
"description": "<p align=\"center\"> <h1 align=\"center\">AngularFire2</h1> <p align=\"center\">The official library for Firebase and Angular 2</p> </p>",
"devDependencies": {
"#angular/compiler-cli": "^2.0.0",
"#angular/platform-server": "^2.0.0-rc.5",
"#types/jasmine": "^2.5.36",
"#types/request": "0.0.30",
"concurrently": "^2.2.0",
"conventional-changelog-cli": "^1.2.0",
"es6-module-loader": "^0.17.10",
"es6-shim": "^0.35.0",
"gulp": "^3.9.0",
"gulp-jasmine": "^2.2.1",
"gulp-typescript": "^2.10.0",
"http-server": "^0.8.5",
"jasmine": "^2.4.1",
"jasmine-core": "^2.4.1",
"json": "^9.0.3",
"karma": "^0.13.19",
"karma-chrome-launcher": "^0.2.2",
"karma-firefox-launcher": "^0.1.7",
"karma-jasmine": "^0.3.6",
"karma-mocha-reporter": "^2.0.2",
"karma-systemjs": "^0.10.0",
"ncp": "^2.0.0",
"parse5": "^1.3.2",
"protractor": "3.0.0",
"reflect-metadata": "0.1.2",
"rimraf": "^2.5.4",
"rollup": "^0.35.11",
"rollup-watch": "^2.5.0",
"systemjs": "^0.19.16",
"systemjs-builder": "^0.15.7",
"traceur": "0.0.96",
"typedoc": "github:jeffbcross/typedoc",
"typescript": "^2.0.2",
"zone.js": "^0.7.2"
},
"directories": {},
"dist": {
"shasum": "8ec172ff17448c3ccdb79e9c6179da556ff05e1b",
"tarball": "https://registry.npmjs.org/angularfire2/-/angularfire2-2.0.0-beta.8.tgz"
},
"homepage": "https://github.com/angular/angularfire2#readme",
"keywords": [
"angular2",
"angular",
"firebase"
],
"license": "MIT",
"main": "bundles/angularfire2.umd.js",
"maintainers": [
{
"name": "angularcore",
"email": "angular-core+npm#google.com"
},
{
"name": "davideast",
"email": "dceast#gmail.com"
},
{
"name": "jeffbcross",
"email": "middlefloor#gmail.com"
}
],
"module": "index.js",
"name": "angularfire2",
"optionalDependencies": {},
"peerDependencies": {
"#angular/common": "^2.0.0",
"#angular/compiler": "^2.0.0",
"#angular/core": "^2.0.0",
"#angular/platform-browser": "^2.0.0",
"#angular/platform-browser-dynamic": "^2.0.0",
"firebase": "^3.0.0",
"rxjs": "^5.0.1"
},
"readme": "ERROR: No README data found!",
"repository": {
"type": "git",
"url": "git+https://github.com/angular/angularfire2.git"
},
"scripts": {},
"typings": "index.d.ts",
"version": "2.0.0-beta.8"
}
The first breaking change (just to make an example that sustains my theory that this is a different version of the package) is that there is no more FirebaseAuth (which seems to be substituted by AngularFireAuth).

It's installing a later version, as that version satisfies the caret range you have specified in the package.json file:
"angularfire2": "^2.0.0-beta.6"
If you want a specific version, remove the caret:
"angularfire2": "2.0.0-beta.6"
Looking at the spec - under that NPM has filled out under _requested in the package.json file that's in node_modules/angularfire2 - you can see that caret range you have specified is equivalent to:
"spec": ">=2.0.0-beta.6 <3.0.0",

Related

How handle versioning in my npm repo package and update the repo

I have an npm package which we created to use within the company.
It has the following package.json:
{
"name": "#company/eslint-config-company-base",
"version": "1.0.4",
"description": "ESLint base configuration file",
"main": "index.js",
"private": false,
"repository": {
"type": "git",
"url": "git+https://github.com/company/eslint-config-company-base.git"
},
"keywords": [
"eslint",
"config",
"airbnb",
"typescript",
"prettier"
],
"author": "company",
"license": "MIT",
"bugs": {
"url": "https://github.com/company/eslint-config-company-base/issues"
},
"homepage": "https://github.com/company/eslint-config-company-base",
"dependencies": {
"#typescript-eslint/eslint-plugin": "^2.6.0",
"#typescript-eslint/parser": "^2.6.0",
"eslint": "^6.6.0",
"eslint-config-airbnb": "^18.0.1",
"eslint-config-airbnb-base": "14.0.0",
"eslint-config-prettier": "^4.3.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-react": "^7.16.0",
"eslint-plugin-react-hooks": "^2.2.0"
}
}
It's created 3 years ago. I have to update all the dependencies.
So the way to go is:
update all the packages
is it enough to change the version number "version": "1.0.4", in the package.json, so you can run npm i -D #company/eslint-config-company-base#latest
which version number should it be. Should it be 2.0.0? From the changelog of the packages I can read there are some breaking changes

How to add mochawesome report generator in webdriverIO?

I've been trying the below in wdio.config.js file on webdriverIO to no avail. I have:
reporters: ['dot',['mochawesome',{
outputDir: './Results', reportTitle: 'My Custom Title', showPassed: false, marge: '--saveHtml'
}],
],
mochawesomeOpts: {
includeScreenshots:true,
screenshotUseRelativePath:true
},
My package.json looks like this:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1 --reporter-options reportDir=Report,reportFilename=Test_Report",
"generateMochawesome":"marge --reporter-options reportDir=Report,reportFilename=Test_Report"
},
"dependencies": {
"#wdio/cli": "^7.9.1",
"mochawesome-report-generator": "^3.1.5",
"mocha-simple-html-reporter": "^2.0.0",
"mochawesome-merge": "^4.2.0",
"mochawesome-screenshots": "^1.7.3",
"npm": "^7.20.6"
},
"devDependencies": {
"#wdio/dot-reporter": "^7.9.0",
"#wdio/local-runner": "^7.9.1",
"#wdio/mocha-framework": "^7.9.1",
"chromedriver": "^92.0.1",
"wdio-chromedriver-service": "^7.2.0",
"wdio-mochawesome-reporter": "^4.0.0"
}
}
I went through this and ended up downgrading some packages, here is my package.json
{
"name": "webdriverio-tests",
"version": "0.1.0",
"description": "",
"private": true,
"keywords": [],
"scripts": {
"test": "wdio test/wdio.conf.ts --spec ./test/specs/integration.e2e.ts",
"generateMochawesome": "marge Results/results-0-0.json --reportTitle 'My Project Results'"
},
"author": "",
"license": "ISC",
"devDependencies": {
"#wdio/cli": "^7.27.0",
"#wdio/dot-reporter": "^7.26.0",
"#wdio/local-runner": "^7.27.0",
"#wdio/mocha-framework": "^7.26.0",
"#wdio/spec-reporter": "^7.26.0",
"chromedriver": "^107.0.3",
"ts-node": "^10.9.1",
"typescript": "^4.9.3",
"wdio-chromedriver-service": "^8.0.0",
"wdio-mochawesome-reporter": "^4.0.0",
"wdio-wait-for": "^3.0.0"
},
"dependencies": {
"mochawesome-report-generator": "^3.1.5"
}
}

Protractor 'spec not found'

I have been happily running tests on a Protractor/Jasmine2 framework. Now, I've started a new project and used the same framework - however, when I tried to run the first spec, I received a 'Spec not found' message.
I have tried all sorts of things....explicit file locations, having spec.js in the root of the project, pushing to BitBucket, deleting the project off my machine and re-cloning. Running on VS Code and Atom makes no difference.
I've stripped the spec.js to something so simple in case it something there but I'm blowed if I can spot anything! Please see conf.js, spec.js and Package.json. Sorry for all of the // in conf.js - kept on stripping things out!!
Hoping for some eagle-eyed person...!! Thanks
PACKAGE.json
{
"name": "jl_autotests",
"version": "1.0.0",
"description": "Autotests",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+ssh://git#bitbucket.org/davred61/jl_autotests.git"
},
"keywords": [
"Cucumber",
"gherkin",
"cuke",
"protractor",
"angular",
"selenium",
"endtoend",
"report",
"e2e",
"javascript"
],
"author": "D Redmayne",
"license": "ISC",
"homepage": "https://bitbucket.org/davred61/jl_autotests#readme",
"dependencies": {
"Express": "^3.0.1",
"angular": "^1.6.6",
"angularjs": "0.0.1",
"cucumber": "^3.1.0",
"glob": "^7.1.2",
"gulp": "^3.9.1",
"lodash": "^4.17.4",
"material-design-lite": "^1.3.0",
"moment": "^2.19.2",
"pretty": "^2.0.0",
"protractor": "^5.2.0",
"protractor-cucumber-framework": "^4.1.1",
"protractor-image-comparison": "^1.3.0"
},
"devDependencies": {
"chai": "^4.1.2",
"express": "^4.16.2",
"gulp-protractor": "^4.1.0",
"jasmine-reporters": "^2.2.1",
"jasmine-spec-reporter": "^4.2.1",
"protractor-jasmine2-html-reporter": "0.0.7",
"protractor-jasmine2-screenshot-reporter": "^0.5.0",
"restify": "^6.3.2"
}
}
Conf.js
//var Jasmine2HtmlReporter = require('protractor-jasmine2-html-reporter');
exports.config = {
//seleniumAddress: 'http://localhost:444/wd/hub',
//directConnect: true,
capabilities: {
cssSelectorsEnabled: true,
'browserName': 'chrome'
},
specs:['spec.js'],
allScriptsTimeout: 60000,
getPageTimetout: 30000,
framework: 'jasmine2',
//onPrepare: function() {
//jasmine.getEnv().addReporter(
//new Jasmine2HtmlReporter({
//takeScreenshots: true,
//savePath: './Reports',
//fileName: 'HomeProfile'
//})
//)
//var SpecReporter = require ( 'jasmine-spec-reporter').SpecReporter;
//jasmine.getEnv().addReporter( new SpecReporter( {
//displayStacktrace: true,
//displayFailureSummary: true,
//displayPendingSummary: true,
//displaySuccessfulSpec: true,
//displayFailedSpec: true,
//displaySpecDuration: false,
//displaySuiteNumber: false,
//colors: {
//success: 'green',
//failure: 'red',
//pending: 'yellow'
// },
//customProcessors: []
//} ));
//}
};
spec.js
browser.get('https://mwac-johnlewis-dev.digitalbridge.eu/landing');
browser.sleep(10000);

Angular 4 CLI cannot find name 'jasmine'

I am using the Angular 4 CLI (v.1.0.0) and to handle testing I created some mocks that use jasmine to create a spy. In the IDE everything looks okay, however in the terminal I am getting and error that says "Cannot find name 'jasmine'".
At first I thought the issue was that jasmine wasn't added to the typings but I can see that package.json includes the import for the jasmine type def so I'm not sure what is missing.
mocks.ts
export class MockAuthService {
public login: Function = jasmine.createSpy('login');
}
export class MockHttpService {
public delete: Function = jasmine.createSpy('delete');
public get: Function = jasmine.createSpy('get');
public post: Function = jasmine.createSpy('post');
public put: Function = jasmine.createSpy('put');
}
running ng serve returns the following error messages in the terminal.
ERROR in C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts
(2,23): Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (6,24):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (7,21):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (8,22):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (9,21):
Cannot find name 'jasmine'.
webpack: Failed to compile.
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/#types"
],
"lib": [
"es2016",
"dom"
]
}
}
tsconfig.spec.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es5",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}
tsconfig.app.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
package.json
{
"name": "prod",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^4.0.2",
"#angular/common": "^4.0.0",
"#angular/compiler": "^4.0.0",
"#angular/core": "^4.0.0",
"#angular/flex-layout": "^2.0.0-beta.8",
"#angular/forms": "^4.0.0",
"#angular/http": "^4.0.0",
"#angular/material": "^2.0.0-beta.3",
"#angular/platform-browser": "^4.0.0",
"#angular/platform-browser-dynamic": "^4.0.0",
"#angular/router": "^4.0.0",
"core-js": "^2.4.1",
"rxjs": "^5.1.0",
"zone.js": "^0.8.4"
},
"devDependencies": {
"#angular/cli": "1.0.0",
"#angular/compiler-cli": "^4.0.0",
"#types/jasmine": "2.5.38",
"#types/node": "~6.0.60",
"codelyzer": "~2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-coverage-istanbul-reporter": "^0.2.0",
"protractor": "~5.1.0",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.0"
}
}
You are getting the error because TypeScript is trying to include the mock in the app build, and the app (rightly) doesn't know about Jasmine.
Exclude the mock from your app compilation by adding it to the exclude array in tsconfig.app.json:
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts",
"**/*.mock.ts"
]
}
I am not sure if you should be creating jasmine spys that way, but regardless:
The issue is with your file name
notice: tsconfig.spec.json has: "include": ["**/*.spec.ts","**/*.d.ts"]
and your file name is mocks.ts.
either change the file name to mocks.spec.ts
or add "**/*.mock.ts" and rename to something like service.mock.ts
Hope this helps.

Browserify Task error

Just started using gulp not long ago, everything works fine before this when I'm stuck at this error. I've tried
//gulpfile.js
var gulp = require('gulp'),
browserify = require('browserify'),
source = require('vinyl-source-stream');
// Browserify task
gulp.task('browserify', function() {
return browserify(['app/scripts/app.js'], {debug:true})
.bundle()
.pipe(source('bundle.js'))
.pipe(gulp.dest('dist/scripts'))
});
Error when running gulp browserify
events.js:141
throw er; // Unhandled 'error' event
^
SyntaxError: Unterminated string constant
Where does this syntax error point to? I've read up some articles on the errors in package.json file too.
"devDependencies": {
"browserify": "^13.0.0",
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.0",
"gulp-clean-css": "^2.0.4",
"gulp-connect": "^3.2.1",
"gulp-imagemin": "^2.4.0",
"gulp-less": "^3.0.5",
"gulp-plumber": "^1.1.0",
"gulp-uglify": "^1.5.3",
"vinyl-source-stream": "^1.1.0"
},
"dependencies": {
"angular": "^1.5.3",
"imagemin-pngquant": "^4.2.2"
}
//browserify package.json
{
"name": "browserify",
"version": "13.0.0",
"description": "browser-side require() the node way",
"main": "index.js",
"bin": {
"browserify": "bin/cmd.js"
},
"repository": {
"type": "git",
"url": "git+ssh://git#github.com/substack/node-browserify.git"
},
"keywords": [
"browser",
"require",
"commonjs",
"commonj-esque",
"bundle",
"npm",
"javascript"
],
"dependencies": {
"JSONStream": "^1.0.3",
"assert": "~1.3.0",
"browser-pack": "^6.0.1",
"browser-resolve": "^1.11.0",
"browserify-zlib": "~0.1.2",
"buffer": "^4.1.0",
"concat-stream": "~1.5.1",
"console-browserify": "^1.1.0",
"constants-browserify": "~1.0.0",
"crypto-browserify": "^3.0.0",
"defined": "^1.0.0",
"deps-sort": "^2.0.0",
"domain-browser": "~1.1.0",
"duplexer2": "~0.1.2",
"events": "~1.1.0",
"glob": "^5.0.15",
"has": "^1.0.0",
"htmlescape": "^1.1.0",
"stream-http": "^2.0.0",
"https-browserify": "~0.0.0",
"inherits": "~2.0.1",
"insert-module-globals": "^7.0.0",
"isarray": "0.0.1",
"labeled-stream-splicer": "^2.0.0",
"module-deps": "^4.0.2",
"os-browserify": "~0.1.1",
"parents": "^1.0.1",
"path-browserify": "~0.0.0",
"process": "~0.11.0",
"punycode": "^1.3.2",
"querystring-es3": "~0.2.0",
"read-only-stream": "^2.0.0",
"readable-stream": "^2.0.2",
"resolve": "^1.1.4",
"shasum": "^1.0.0",
"shell-quote": "^1.4.3",
"stream-browserify": "^2.0.0",
"string_decoder": "~0.10.0",
"subarg": "^1.0.0",
"syntax-error": "^1.1.1",
"through2": "^2.0.0",
"timers-browserify": "^1.0.1",
"tty-browserify": "~0.0.0",
"url": "~0.11.0",
"util": "~0.10.1",
"vm-browserify": "~0.0.1",
"xtend": "^4.0.0"
},
"devDependencies": {
"backbone": "~0.9.2",
"browser-unpack": "^1.1.1",
"coffee-script": "~1.10.0",
"coffeeify": "~1.1.0",
"es6ify": "~0.4.8",
"isstream": "^0.1.2",
"seq": "0.3.5",
"tap": "^2.2.0",
"temp": "^0.8.1",
"through": "^2.3.4"
},
"author": {
"name": "James Halliday",
"email": "mail#substack.net",
"url": "http://substack.net"
},
"scripts": {
"test": "tap test/*.js"
},
"license": "MIT",
"gitHead": "5b82a2f1bc061cb47ff4aa7c702ed79fc20effa8",
"bugs": {
"url": "https://github.com/substack/node-browserify/issues"
},
"homepage": "https://github.com/substack/node-browserify#readme",
"_id": "browserify#13.0.0",
"_shasum": "8f223bb24ff4ee4335e6bea9671de294e43ba6a3",
"_from": "browserify#latest",
"_npmVersion": "2.14.7",
"_nodeVersion": "4.2.3",
"_npmUser": {
"name": "feross",
"email": "feross#feross.org"
},
"dist": {
"shasum": "8f223bb24ff4ee4335e6bea9671de294e43ba6a3",
"tarball": "http://registry.npmjs.org/browserify/-/browserify- 13.0.0.tgz"
},
"maintainers": [
{
"name": "domenic",
"email": "d#domenic.me"
},
{
"name": "dominictarr",
"email": "dominic.tarr#gmail.com"
},
{
"name": "feross",
"email": "feross#feross.org"
},
{
"name": "jmm",
"email": "npm-public#jessemccarthy.net"
},
{
"name": "mafintosh",
"email": "mathiasbuus#gmail.com"
},
{
"name": "maxogden",
"email": "max#maxogden.com"
},
{
"name": "mellowmelon",
"email": "palmermebane#gmail.com"
},
{
"name": "substack",
"email": "substack#gmail.com"
},
{
"name": "terinjokes",
"email": "terinjokes#gmail.com"
},
{
"name": "thlorenz",
"email": "thlorenz#gmx.de"
},
{
"name": "zertosh",
"email": "zertosh#gmail.com"
}
],
"directories": {},
"_resolved": "https://registry.npmjs.org/browserify/-/browserify-13.0.0.tgz",
"readme": "ERROR: No README data found!"
}
I manage to run this without error by adding
{
"devDependencies": {
"browserify": "^13.0.0",
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.0",
"gulp-clean-css": "^2.0.4",
"gulp-connect": "^3.2.1",
"gulp-imagemin": "^2.4.0",
"gulp-less": "^3.0.5",
"gulp-plumber": "^1.1.0",
"gulp-uglify": "^1.5.3",
"vinyl-source-stream": "^1.1.0"
},
"dependencies": {
"angular": "^1.5.3",
"imagemin-pngquant": "^4.2.2"
},
//Tells browserify to use browserify-shim
"browserify": {
"transform": [ "browserify-shim" ]
},
"browserify-shim": {
"./app/scripts/app.js": "$"
}
}