I've been developing a site for a customer using angularjs as front-end. The tests were written using protractor.
When I run the site using Tomcat 8 in eclipse, the site works as expected, but when the test run using the npm http-server, my service to share data between 2 directives isn't operational. The service.variable remains undefined all the time.
I've set up a Plunker to represent the structure as much as possible
http://plnkr.co/edit/b49YHoFUlwjFUvsn2Y0C?p=preview
package.json
{
"version": "1.0.5",
"private": true,
"name": "troubleshooting-webapp",
"description": "Troubleshooting REST Service",
"devDependencies": {
"bower": "^1.4.1",
"http-server": "^0.8.5",
"protractor": "^3.0.0",
"protractor-http-mock": "^0.2.1",
"shelljs": "^0.2.6",
"tmp": "0.0.23"
},
"scripts": {
"setup": "npm install",
"start": "cd src/main && http-server -a 0.0.0.0 -p 8000",
"stop": "pkill --signal SIGINT node",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor src/main/webapp/js/tests/protractor-conf.js",
"preprotractor_debug": "npm run update-webdriver",
"protractor_debug": "protractor debug src/main/webapp/js/tests/protractor-conf.js"
}
}
protractor-conf.js
exports.config = {
allScriptsTimeout: 18000,
specs: [
'e2e/*.js'
],
mocks: {
dir: 'mocks'
},
onPrepare: function(){
require('protractor-http-mock').config = {
rootDirectory: __dirname, // default value: process.cwd()
protractorConfig: 'protractor-conf.js' // default value: 'protractor.conf'
};
},
capabilities: {
'browserName': 'firefox'
},
baseUrl: 'http://localhost:8000/',
framework: 'jasmine',
jasmineNodeOpts: {
defaultTimeoutInterval: 90000
}
};
Any ideas of why the filterSelection service remains undefined whould be nice.
After some more research, it seems like the mocks aren't loading either.
Related
I'm making a Gatsby site, and I've intially set it up to use markdown files via gatsby-transformer-remark. I've since decided to move it over to MDX in order to have a bit more freedom in what content I can use.
I've followed this guide to migrate the project from MD to MDX, but I keep getting the following error:
Cannot find module 'D:\XXXX\XXXX\gatsby\.cache\caches\gatsby-plugin-mdx\webpack\output.js'
Require stack:
- D:\XXXX\XXXX\gatsby\node_modules\gatsby-plugin-mdx\utils\render-html.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby-plugin-mdx\gatsby\source-nodes.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby-plugin-mdx\gatsby-node.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\bootstrap\load-plugins\validate.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\bootstrap\load-plugins\load.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\bootstrap\load-plugins\index.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\services\initialize.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\services\index.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\state-machines\develop\services.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\state-machines\develop\index.js
- D:\XXXX\XXXX\gatsby\node_modules\gatsby\dist\commands\develop-process.js
- D:\XXXX\XXXX\gatsby\.cache\tmp-4452-lp3aICfNr8bo
I've tried:
Clearing cache and build files (gatsby clean)
Updating all packages, including Gatsby itself
Various ways to include the plugin in gatsby-config.js
Changing it all back to MD, making sure it works, and then migrating it to MDX once again.
Doing a build. Same thing happens as when running gatsby develop
Deleting package-lock.json and node_modules folder and running npm install again.
Nothing worked. This has to be something really stupid to do with NPM or Webpack but I just don't see it.
gatsby-config.js
module.exports = {
siteMetadata: {
title: "XXXX",
copyright: "XXXX"
},
plugins: [
{
resolve: `gatsby-plugin-mdx`,
options: {
extensions: [`.md`, `.mdx`],
},
},
`gatsby-transformer-remark`,
`gatsby-plugin-image`,
`gatsby-plugin-sharp`,
`gatsby-transformer-sharp`,
{
resolve: `gatsby-source-filesystem`,
options: {
name: `src`,
path: `${__dirname}/src/`,
},
},
]
}
package.json
{
"name": "gatsby-starter-hello-world",
"private": true,
"description": "A simplified bare-bones starter for Gatsby",
"version": "0.1.0",
"license": "0BSD",
"scripts": {
"build": "gatsby build",
"develop": "gatsby develop",
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,md}\"",
"start": "npm run develop",
"serve": "gatsby serve",
"clean": "gatsby clean",
"test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"
},
"dependencies": {
"#mdx-js/mdx": "^1.6.22",
"#mdx-js/react": "^1.6.22",
"gatsby": "^3.1.2",
"gatsby-plugin-image": "^1.1.2",
"gatsby-plugin-mdx": "^2.1.0",
"gatsby-plugin-sharp": "^3.1.2",
"gatsby-source-filesystem": "^3.1.0",
"gatsby-transformer-remark": "^3.1.0",
"gatsby-transformer-sharp": "^3.1.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-in-viewport": "^1.0.0-alpha.16",
"react-reveal-text": "^0.1.1",
"react-spring": "^8.0.27",
"react-text-loop": "^2.3.0"
},
"devDependencies": {
"prettier": "2.2.1"
},
"repository": {
"type": "git",
"url": "https://github.com/gatsbyjs/gatsby-starter-hello-world"
},
"bugs": {
"url": "https://github.com/gatsbyjs/gatsby/issues"
}
}
EDIT:
I should point out that when I go that location in cache that's mentioned in the error, there really is no webpack folder, nor output.js - so it really isn't being generated when I run gatsby develop, I just can't understand why.
I've also tried making a new project by cloning the offical gatsby mdx starter template, and that is working just fine out of the box.
I was running an Electron project, and everything worked just fine. But now when I run any of the scripts in my package.json (including npm start), it just escapes a line and doesn't do anything.
My package.json:
{
"name": "interclip-desktop",
"version": "0.0.7",
"description": "Interclip for desktop",
"repository": "https://github.com/aperta-principium/Interclip-desktop",
"main": "main.js",
"scripts": {
"start": "electron .",
"package-mac": "electron-packager . --overwrite --asar=true --platform=darwin --arch=x64 --icon=assets/icons/mac/icon.icns --prune=true --out=release-builds",
"package-win": "electron-packager . Interclip --overwrite --platform=win32 --arch=ia32 --icon=assets/icons/win/icon.ico --prune=true --out=release-builds --version-string.CompanyName=CE --version-string.FileDescription=CE --version-string.ProductName=\"Interclip\"",
"package-linux": "electron-packager . Interclip --overwrite --asar=true --platform=linux --arch=x64 --icon=assets/icons/png/icon.png --prune=true --out=release-builds",
"win-install": "node installers/windows/createinstaller.js",
"postinstall": "electron-builder install-app-deps",
"build": "electron-builder --linux",
"release": "electron-builder --linux --publish always"
},
"keywords": [
"Desktop",
"Interclip"
],
"author": "Filip Troníček",
"license": "MIT",
"devDependencies": {
"electron": "^7.1.2",
"electron-builder": "^22.1.0",
"electron-installer-dmg": "^3.0.0",
"electron-packager": "^14.1.1",
"electron-reload": "^1.5.0",
"electron-winstaller": "^4.0.0"
},
"dependencies": {
"axios": "^0.19.0",
"mousetrap": "^1.6.3"
},
"build": {
"appId": "com.aperta-principium.interclip",
"productName": "Interclip",
"mac": {
"category": "public.app-category.utilities"
},
"dmg": {
"icon": false
},
"linux": {
"target": [
"AppImage"
],
"category": "Utility"
}
}
}
I tried updating NPM, didn't work. When I tried in different projects, also doesn't work.
Thanks in advance
npm has a ignore-scripts configuration key. It's expected value is a Boolean and it's set to false by default.
Perhaps it has inadvertently been set to true.
To get/set the ignore-scripts configuration you can utilize the npm-config command:
Check its current setting by running:
npm config get ignore-scripts
If the aforementioned command returns true then reset it to false by running:
npm config set ignore-scripts false
If you are using an integrated terminal (such as the VsCode integrated terminal) try running your npm "run dev' command from your PowerShell (or cmd) terminal. This error arises as a result of your integrated terminal not recognizing your command (especially if you created your app with a git bash terminal).
Try this, and I hope it helps someone cause it always works for me. Cheers!!!
I have existing React Apps which are published to production web servers but I want to run them from the desktop using Electron. However, I do not want to disturb the React App package.json. I attempted to decouple an existing online tutorial by paachu on Medium but was unsuccessful. It kept failing trying to locate "main...chunk.css" and other resources needed by the React App.
With that said, I have a working React App in directory ./projx/reactApp I would like to create an Electron App in ./projx/electronApp that will build and create a packaged executable using electron-builder. The dev environment is not necessary at this time in that I only need a release package to distribute. Here is a package.json that almost works:
{
"name": "wrappedReact",
"version": "1.0.0",
"main": "./src/electron.js",
"scripts": {
"preclean": "cross-env rm -rf build",
"react-prebuild": "cross-env cp -r ../reactApp/build build",
"build-tsapp": "tsc ./src/electron.ts",
"electron-prebuild": "mv ./src/*.js ../build",
"electron-build": "npm run electron-prebuild && electron-builder",
"build": "npm run preclean && npm run electron-build",
"startdev": "concurrently \"tsc ./src/electron.ts -w\" \"cross-env
NODE_ENV=dev nodemon --exec \"\"wait-on http://localhost:3000 &&
electron src/electron.js\"\""
},
"author": "sfanjoy",
"homepage": "./",
"electron-pack": "build --em.main=build/electron.js",
"build": {
"appId": "com.example.reactApp",
"productName": "ReactApp",
"copyright": "Copyright © 2019 sfanjoy",
"files": [
"build/**/*",
"node_modules/**/*"
],
"directories": {
"buildResources": "assets"
},
"win": {
"target": "portable",
"icon": "assets/app.ico"
}
},
"dependencies": {
"#types/electron": "^1.6.10"
},
"devDependencies": {
"#types/electron": "^1.6.10",
"concurrently": "^4.1.1",
"cross-env": "^5.2.1",
"electron-builder": "^21.2.0",
"electron-is-dev": "^1.1.0",
"nodemon": "^1.19.1",
"typescript": "^3.5.2",
"wait-on": "^3.2.0"
}
}
I think the solution is with electron-builder if it would allow you to inject the ./src/electron.js into the prebuilt reactApp\dist\win-unpacked\resources\app.asar. I could then copy the reactApp/build directory, inject into the asar, and call electron-builder.
This by far (IMO) is the best starting setup (Boilerplate) I have come accross:
https://github.com/nateshmbhat/electron-react-ts-starter/
I'm working on angularjs from 1 to 2 upgrade tutorial (Angular 1 upgrade) and phonecat codebase example. After installing typescript and all mentioned dependencies adding a type :boolean for a function parameter input makes chrome fails the execution with "Uncaught SyntaxError: Unexpected token :" checkmarkFilterProvider consecutively is not created and fails the Provider injection into a component.
(function() {
///<reference path='../../../typings/index.d.ts' />
'use strict';
angular.
module('core').
filter('checkmark', function() {
return function(input:boolean) {
return input ? '\u2713' : '\u2718';
};
});
})();
npm run tsc -w command compiles .ts files and creates maps, however, browser execution fails.
package.json
{
"name": "angular-phonecat",
"private": true,
"version": "0.0.0",
"description": "A tutorial application for AngularJS",
"repository": "https://github.com/angular/angular-phonecat",
"license": "MIT",
"dependencies": {},
"devDependencies": {
"bower": "^1.7.7",
"concurrently": "^2.1.0",
"http-server": "^0.9.0",
"jasmine-core": "^2.4.1",
"karma": "^0.13.22",
"karma-chrome-launcher": "^0.2.3",
"karma-firefox-launcher": "^0.1.7",
"karma-jasmine": "^0.3.8",
"protractor": "^3.2.2",
"shelljs": "^0.6.0",
"tsc": "^1.20150623.0",
"typescript": "^1.8.10",
"typings": "^1.0.4"
},
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run http\" ",
"tsc": "tsc",
"tsc:w": "tsc -w",
"typings": "typings",
"http": "http-server -a localhost -p 8000 -c-1 ./app",
"pretest": "npm install",
"test": "karma start karma.conf.js",
"test-single-run": "karma start karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor e2e-tests/protractor.conf.js",
}
}
tsconfig.json
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false,
"suppressImplicitAnyIndexErrors": true
},
"exclude": [
"node_modules"
]
}
In the end *.ts source files are compiled in a project explorer but browser doesn't have them as #tadwork pointed out. What is my configuration missing out?
Update
To run the angular app I execute npm start script from package.json that theoretically should compile *.ts files and run http-server with the ./app as a server source (see package.json scripts -> start).
./app folder after script execution has compiled *.js and *.map.js files.
looks like the Typescript type annotations are getting injected into the browser without getting compiled so the types are still on the input parameter
return function(input: boolean )
What changes do I have to make inorder to actually run a successful build and host my website on bluemix?
Right now, this is my Gruntfile.js, manifest.yml and package.json. The base folder 'app' is an Angular application -
module.exports = function(grunt){
grunt.initConfig({
connect: {
server: {
options: {
port: 9000,
base: 'app',
keepalive: true,
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-connect');
grunt.registerTask('default', ['connect']);
};
package.json:
{
"name": "dummy",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {"grunt-cli": "^1.2.0",
"grunt": "^0.4.5",
"grunt-contrib-connect": "^0.10.1"
}
}
manifest.yml:
---
applications: #Reference http://docs.cloudfoundry.com/docs/using/deploying-apps/manifest.html
- name: dummy #Application Name. Unique to the user's Space
memory: 256M #The maximum memory to allocate to each application instance
instances: 1 #The number of instances of the application to start
path: ./ #Path to the application to be pushed
command: npm install && node_modules/.bin/grunt serve #The command to use to start the application
Few suggestions when working with node applications and Bluemix:
To start a node application it's recommended to use npm start and specify the script in the package.json.
If your application needs to build assets, specify how to do that in the postinstall script in the package.json. For example if you are using Gulp and your main task is build you will have something like:
"postinstall": "gulp build"
When running in Bluemix VCAP_APP_HOST and VCAP_APP_PORT will have the host and port where your application will run.
The files below have the fixes mentioned above:
manifest.yml:
---
applications:
- name: dummy-kartik-yadav
memory: 512M
instances: 1
path: .
command: npm start
package.json:
{
"name": "dummy",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node_modules/.bin/grunt serve",
"postinstall": "console.log('build ui assets like js, css, html...')"
},
"author": "",
"license": "ISC",
"dependencies": {
"grunt-cli": "^1.2.0",
"grunt": "^0.4.5",
"grunt-contrib-connect": "^0.10.1"
}
}
gruntfile.js:
module.exports = function(grunt){
grunt.initConfig({
connect: {
server: {
options: {
port: process.env.VCAP_APP_PORT || 9000, # listen to the port that bluemix will assign you
base: 'app',
keepalive: true
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-connect');
grunt.registerTask('default', ['connect']);
};
After doing the changes mentioned above, open the project folder and run npm start. If it works locally, it will in Bluemix.