Related
I have dynamic configuration for my EAS environment:
eas.json
{
"cli": {
"version": ">= 0.55.1",
"appVersionSource": "local"
},
"build": {
"development": {
"distribution": "internal",
"ios": {
"simulator": true
},
"env": {
"API_URL": "http://localhost/",
"APP_ENV": "development",
}
},
"staging": {
"distribution": "internal",
"env": {
"API_URL": "https://dev.my-url.com/",
"APP_ENV": "staging",
}
},
"production": {
"env": {
"API_URL": "https://my-url.com/",
"APP_ENV": "production",
}
}
},
"submit": {
"production": {
"android": {
"serviceAccountKeyPath": "./keys/pc-api-ccc.json",
"track": "internal"
}
},
"staging": {
"extends": "production"
}
}
}
and accordingly have app.config.js
import "dotenv/config";
export default () => {
console.log("ENV", process.env.API_URL);
return {
//...
extra: {
API_URL: process.env.API_URL,
APP_ENV: process.env.APP_ENV,
DEEP_LINK: process.env.DEEP_LINK,
eas: {
projectId: "2c680410-428f-431d-911f-fb378e45b885",
},
//...
};
For some reason, after running eas build -p ios --profile staging config default function is called 3 times and in last call environment variables are lost:
console.log output:
ENV https://my-url.com/
ENV https://my-url.com/
ENV undefined
Any idea why 3 times? or why I'm loosing env variables on last call?
I'm creating unit testing for a React native application, and what happens is, after the test initiate , it hangs , without any response from the terminal . I've tried to use --forceExit , --detectOpenHandles to log any problem. but the terminal continues as follow:
I've Intellij IDE , and running the same test on it I've this result
Note that where is written Running Tests... it's shows a loading icon, the test continues running on Intellij even after the test were completed.
here's the code of my testing :
/**
* #jest-environment jsdom
*/
import React from 'react';
import { mount, ReactWrapper, shallow } from 'enzyme';
import AnotherComponent from 'components/AnotherComponent';
// #ts-ignore
import { mocking } from './helpers/mockedTheme';
import TestComponent from 'components/TestComponent';
export const shallowWithTheme = (children: any) => (
// #ts-ignore
shallow(children, { mocking })
);
describe('Test Components', () => {
describe('Test Component', ()=>{
it('Test shallow with theme', () => {
const element = shallowWithTheme(<TestComponent componentProp={"test"}/>);
//#ts-ignore
expect(element).toExist();
});
});
describe('Test AnotherComponent', () =>{
it('AnotherComponent with button', () => {
const wrapper = shallowWithTheme(
<AnotherComponent icon="qr-code"
title='component title'
description='component description'
buttonText='go'
/>);
// #ts-ignore
expect(wrapper).toExist();
});
it('AnotherComponent without button', () => {
const wrapper = shallow(
<AnotherComponent icon="qr-code"
title='component title'
description='component description'
/>);
//#ts-ignore
expect(wrapper).toExist();
});
});
});
The components AnotherComponent and TestComponent are nested with another styled.components eg,:
\\ TestComponent
import React from 'react';
import { MainContentView } from 'components/TestComponent/TestComponent.styles';
import { throwJSError } from 'reduxRoot/util/error';
import { withTheme } from 'styled-components/native';
import { Text } from 'react-native';
class TestComponent extends React.Component {
render() {
try {
return (
<MainContentView>
<Text>Text</Text>
</MainContentView>
);
} catch (err) {
throwJSError(err, 'TestComponent/render');
return null;
}
}
}
export default withTheme(TestComponent);
The style MainContentView is a styled.component eg.:
export const MainContentView = styled.View` flex: 1; backgroundColor: #FFFFFF;`;
here my jest ---debug
{
"configs": [
{
"automock": false,
"browser": false,
"cache": true,
"cacheDirectory": "/private/var/folders/rk/rnc3852s3y56rx7bypry2qz92b2nhd/T/jest_j25hjh",
"clearMocks": false,
"coveragePathIgnorePatterns": [
"/node_modules/"
],
"cwd": "<root-to-my-project>",
"dependencyExtractor": null,
"detectLeaks": false,
"detectOpenHandles": true,
"errorOnDeprecated": false,
"filter": null,
"forceCoverageMatch": [],
"globalSetup": null,
"globalTeardown": null,
"globals": {
"ts-jest": {
"babelConfig": true,
"isolatedModules": true
}
},
"haste": {
"defaultPlatform": "ios",
"platforms": [
"android",
"ios",
"native"
],
"hasteImplModulePath": "<root-to-my-project>/node_modules/react-native/jest/hasteImpl.js",
"providesModuleNodeModules": [
"react-native"
]
},
"moduleDirectories": [
"node_modules"
],
"moduleFileExtensions": [
"js",
"json",
"jsx",
"ts",
"tsx",
"node"
],
"moduleNameMapper": [
[
"reduxRoot(.*)$",
"<root-to-my-project>/redux$1"
],
[
"screens(.*)$",
"<root-to-my-project>/src/screens$1"
],
[
"^React$",
"<root-to-my-project>/node_modules/react/index.js"
]
],
"modulePathIgnorePatterns": [
"<root-to-my-project>/node_modules/react-native/Libraries/react-native/"
],
"name": "a1c9dcb3024a2c47c9517df7e59341e3",
"prettierPath": "prettier",
"resetMocks": false,
"resetModules": false,
"resolver": null,
"restoreMocks": false,
"rootDir": "<root-to-my-project>",
"roots": [
"<root-to-my-project>"
],
"runner": "jest-runner",
"setupFiles": [
"<root-to-my-project>/node_modules/react-native/jest/setup.js",
"<root-to-my-project>/native/node_modules/react-native-gesture-handler/jestSetup.js"
],
"setupFilesAfterEnv": [
"<root-to-my-project>/jest.setup.js"
],
"skipFilter": false,
"snapshotSerializers": [],
"testEnvironment": "<root-to-my-project>/node_modules/jest-environment-node/build/index.js",
"testEnvironmentOptions": {},
"testLocationInResults": false,
"testMatch": [
"**/__tests__/*.(ts|tsx|js)"
],
"testPathIgnorePatterns": [
"/node_modules/"
],
"testRegex": [],
"testRunner": "<root-to-my-project>/node_modules/jest-jasmine2/build/index.js",
"testURL": "http://localhost",
"timers": "real",
"transform": [
[
"^.+\\.tsx?$",
"<root-to-my-project>/node_modules/ts-jest/dist/index.js"
],
[
"\\.js$",
"<root-to-my-project>/node_modules/react-native/jest/preprocessor.js"
],
[
"^.+\\.(js|ts|tsx)$",
"<root-to-my-project>/node_modules/babel-jest/build/index.js"
],
[
"^.+\\.(bmp|gif|jpg|jpeg|mp4|png|psd|svg|webp)$",
"<root-to-my-project>/node_modules/react-native/jest/assetFileTransformer.js"
]
],
"transformIgnorePatterns": [
"node_modules/(?!(jest-)?react-native|react-clone-referenced-element|#react-native-community)"
],
"watchPathIgnorePatterns": []
}
],
"globalConfig": {
"bail": 0,
"changedFilesWithAncestor": false,
"collectCoverage": false,
"collectCoverageFrom": null,
"coverageDirectory": "<root-to-my-project>/coverage",
"coverageReporters": [
"json",
"text",
"lcov",
"clover"
],
"coverageThreshold": null,
"detectLeaks": false,
"detectOpenHandles": true,
"errorOnDeprecated": false,
"expand": false,
"filter": null,
"globalSetup": null,
"globalTeardown": null,
"json": false,
"listTests": false,
"maxConcurrency": 5,
"maxWorkers": 3,
"noStackTrace": false,
"nonFlagArgs": [],
"notify": false,
"notifyMode": "failure-change",
"passWithNoTests": false,
"projects": null,
"rootDir": "<root-to-my-project>",
"runTestsByPath": false,
"skipFilter": false,
"testFailureExitCode": 1,
"testPathPattern": "",
"testResultsProcessor": null,
"testSequencer": "<root-to-my-project>/node_modules/#jest/test-sequencer/build/index.js",
"updateSnapshot": "new",
"useStderr": false,
"verbose": true,
"watch": false,
"watchman": true
},
"version": "24.9.0"
}
And last but not least , my jest.setup.js to mock all I need to run my enviroment:
import { NativeModules } from 'react-native';
import 'jest-styled-components';
import 'react-native';
import 'jest-enzyme';
import Adapter from 'enzyme-adapter-react-16';
import { configure } from 'enzyme';
/**
* Set up Enzyme to mount to DOM, simulate events,
* and inspect the DOM in tests.
*/
configure({ adapter: new Adapter() });
/**
* Set up DOM in node.js environment for Enzyme to mount to
*/
const { JSDOM } = require('jsdom');
const jsdom = new JSDOM('<!doctype html><html><body></body></html>');
const { window } = jsdom;
function copyProps(src, target) {
Object.defineProperties(target, {
...Object.getOwnPropertyDescriptors(src),
...Object.getOwnPropertyDescriptors(target),
});
}
global.window = window;
global.document = window.document;
global.navigator = {
userAgent: 'node.js',
};
copyProps(window, global);
jest.mock('react-navigation/src/routers/KeyGenerator', () => ({
generateKey: jest.fn(() => 123),
}));
jest.mock('./node_modules/react-native-reanimated/src/ReanimatedEventEmitter');
jest.mock('./node_modules/react-native-reanimated/src/ReanimatedModule');
jest.mock('react-native-gesture-handler', () =>({
State: jest.fn(),
TapGestureHandler: jest.fn()
}));
NativeModules.RNCNetInfo = {
getCurrentState: jest.fn(() => Promise.resolve()),
addListener: jest.fn(),
removeListeners: jest.fn()
};
jest.mock('react-native-device-info', () => {
return {
getVersion: jest.fn(() => Promise.resolve('1.0')),
getApplicationName: jest.fn(() => Promise.resolve('My App')),
getModel: jest.fn(() => Promise.resolve('iPhone 11')),
hasNotch: jest.fn(),
};
});
jest.mock('services/theme/scaling', () => ({
scale: jest.fn()
})
);
jest.mock('services/theme/styles', () => ({
themeVal: jest.fn()
})
);
NativeModules.StatusBarManager = {
HEIGHT : 20,
getHeight: jest.fn()
};
NativeModules.ParentBridge ={
partnerId: jest.fn()
};
NativeModules.CTNConfig = { buildEnvironment: 'Development'};
So. Has someone knows how to configure properly my code to be able to see my unit testing finishing and not hanging anymore?
ps.: I've note I've recieving a warning message, don't know this is related on the reasons the test is hanging:
Warning: Async Storage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '#react-native-community/async-storage' instead of 'react-native'. See https://github.com/react-native-community/react-native-async-storage```
I have completed my first react-native app. Now, I want to do unit testing and get code coverage for the whole application using jest. I have used npm packages like i18n-js, react-native-languages.
splash-test.js:
import React from 'react';
import Splash from '../Src/components/authentication/Splash';
import renderer from 'react-test-renderer';
test('renders correctly',()=>{
const tree = renderer.create(
<Splash />
).toJSON();
expect(tree).toMatchSnapshot();
})
env.js:
jest.mock('react-native-languages', () => ({
RNLanguages: {
language: 'en',
languages: ['en'],
},
}));
package.json:
{
"name": "app-name",
"version": "1.0.4",
"private": true,
"rnpm": {
"assets": [
"Src/assets/fonts/"
]
},
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest --coverage --coverageDirectory=output/coverage/jest"
},
"dependencies": {
"i18n-js": "^3.1.0",
"react": "16.6.3",
"react-native": "0.57.8",
"react-native-fast-image-zoom-viewer": "^2.3.0",
"react-native-firebase": "^5.1.1",
"react-native-gifted-chat": "^0.7.2",
"react-native-image-crop-picker": "^0.21.3",
"react-native-image-zoom-viewer": "^2.2.25",
"react-native-languages": "^3.0.1",
"react-native-material-dropdown": "^0.11.1",
"react-native-modal": "^7.0.2",
"react-native-permissions": "^1.1.1",
"react-native-progress": "^3.5.0",
"react-native-restart": "0.0.9",
"react-native-spinkit": "^1.1.1",
"react-native-swiper": "^1.5.14",
"react-native-view-toast": "0.0.1",
"react-navigation": "^3.0.8",
"react-redux": "^6.0.0",
"realm": "^2.22.0",
"redux": "^4.0.1",
"redux-thunk": "^2.3.0",
"rn-fetch-blob": "^0.10.15",
"tipsi-stripe": "^7.1.0"
},
"devDependencies": {
"babel-jest": "^23.6.0",
"jest": "^23.6.0",
"jest-junit": "^6.2.1",
"metro-react-native-babel-preset": "^0.51.0",
"react-test-renderer": "^16.6.3"
},
"jest": {
"preset": "react-native",
"transform": {
"^.+\\.(js)$": "<rootDir>/node_modules/react-native/jest/preprocessor.js"
},
"setupFiles": [
"./test/env.js"
],
"coverageReporters": [
"text"
],
"reporters": [
"default",
"jest-junit"
],
"collectCoverageFrom": [
"Src/**/*.{js,jsx}",
"!/node_modules/"
],
"transformIgnorePatterns": [
"node_modules/(?!(react-native|react-native-languages)/)"
]
},
"jest-junit": {
"output": "output/coverage/junit/junit.xml",
"usePathForSuiteName": "true"
}
}
Now, If i give npm test it throws an error as i mentioned in title. Someone tell me how to bypass all the npm modules i have used in the app.
Thanks in advance!
I'm writing tests for react-native with Jest and Typescript, but i'm with a problem when i mock a module that uses export default and export.
my mock is this:
// test.setup.js
jest.mock('react-native-text-input-mask', () => ({
default: 'TextInputMask',
mask: () => {},
unmask: () => {},
}));
but the jest can not use the default e cause error in my code when test is running:
import React, { Component } from 'react'
import { } from 'react-native'
import TextInputMask, { mask } from 'react-native-text-input-mask'
console.log(TextInputMask) // {'default': 'TextInputMask', mask: [Function]}
console.log(mask) // [Function]
export default class Comp extends Component<> {
constructor(props) {
super(props)
}
render(): JSX.Element {
return (
<TextInputMask // error in this line
mask={'[0000]'}
/>
)
}
}
Error in test:
Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
How i can mock a module with default export and export ?
my jest config:
// package.json
"devDependencies": {
"#types/fbemitter": "2.0.32",
"#types/jest": "21.1.1",
"#types/prop-types": "15.5.2",
"#types/react": "16.0.9",
"#types/react-intl": "2.3.2",
"#types/react-native": "0.48.9",
"#types/react-navigation": "1.0.20",
"#types/react-redux": "5.0.9",
"#types/react-test-renderer": "15.5.4",
"#types/redux-immutable-state-invariant": "2.0.2",
"#types/redux-mock-store": "0.0.11",
"#types/redux-storage": "4.0.10",
"babel-core": "6.26.0",
"babel-jest": "21.2.0",
"babel-plugin-jest-hoist": "21.2.0",
"babel-plugin-module-resolver": "2.7.1",
"babel-plugin-transform-decorators-legacy": "1.3.4",
"babel-preset-react-native": "4.0.0",
"chai": "4.1.2",
"chai-as-promised": "7.1.1",
"colors": "1.1.2",
"commitizen": "2.9.6",
"cz-conventional-changelog": "2.0.0",
"enzyme": "3.0.0",
"fbemitter": "2.1.1",
"husky": "^0.14.3",
"jest": "21.2.1",
"jest-cli": "21.2.1",
"jest-serializer-enzyme": "1.0.0",
"mocha": "3.5.3",
"plop": "1.9.0",
"prettier": "1.7.3",
"react-addons-test-utils": "15.6.2",
"react-dom": "16.0.0",
"react-native-debugger-open": "0.3.12",
"react-test-renderer": "16.0.0",
"redux-devtools-extension": "2.13.2",
"redux-immutable-state-invariant": "2.1.0",
"redux-mock-store": "1.3.0",
"rimraf": "2.6.2",
"selenium-webdriver": "3.5.0",
"sinon": "4.0.0",
"standard-version": "4.2.0",
"ts-jest": "21.0.1",
"tslint": "5.7.0",
"tslint-config-prettier": "1.5.0",
"tslint-react": "3.2.0",
"typescript": "2.5.3",
"wd": "1.4.1"
},
"jest": {
"preset": "react-native",
"collectCoverage": true,
"collectCoverageFrom": [
"src/**/*.{ts,tsx}",
"!src/**/*.test.{ts,tsx}",
"!src/**/*.d.ts",
"!build/**",
"!**/node_modules/**"
],
"coverageDirectory": "coverage",
"moduleDirectories": [
"node_modules",
"src"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__scripts__/assetsTransformer.js",
"^#animations.+\\.(json)$": "<rootDir>/__scripts__/assetsTransformer.js"
},
"moduleFileExtensions": [
"js",
"jsx",
"json",
"ts",
"tsx",
"ios.ts",
"android.ts"
],
"modulePathIgnorePatterns": [
"<rootDir>/build/"
],
"testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
"setupFiles": [
"./__scripts__/test-setup.js"
],
"testPathIgnorePatterns": [
"<rootDir>/build/",
"<rootDir>/node_modules/"
],
"transform": {
"^.+\\.js$": "<rootDir>/node_modules/babel-jest",
"^.+\\.tsx?$": "<rootDir>/node_modules/ts-jest/preprocessor.js"
},
"transformIgnorePatterns": [
"node_modules/(?!react-native|tcomb-form-native|react-navigation|lottie-react-native|jail-monkey|redux-persist/es/storage)"
],
"globals": {
"ts-jest": {
"useBabelrc": true
}
}
},
my TS config:
// tsconfig.json
{
"compilerOptions": {
"target": "es2015",
"module": "es2015",
"jsx": "react-native",
"watch": true,
"allowJs": true,
"sourceMap": true,
"preserveConstEnums": true,
"removeComments": true,
"lib": [
"dom",
"es2017"
],
"diagnostics": false,
"noImplicitAny": false,
"noImplicitUseStrict": false,
"strictNullChecks": false,
"noImplicitThis": false,
"moduleResolution": "node",
"outDir": "./build",
"rootDir": "./src",
"sourceRoot": ".",
"baseUrl": "./src",
"typeRoots": [
"./src/types"
],
"paths": {
"#assets/*": [
"../assets/*"
],
"#animations/*": [
"../animations/*"
]
},
"allowSyntheticDefaultImports": true,
"experimentalDecorators": true
},
"types": [
"react",
"react-native",
"jest"
],
"include": [
"src/**/*"
],
"exclude": [
"index.android.js",
"index.ios.js",
"build",
"app",
"node_modules"
],
"compileOnSave": true
}
I resolve this, creating a mock for the component, like this:
// __mocks__/react-native-text-input-mask.tsx
import React from 'react'
class TextInputMask extends React.Component {
render() {
return null
}
}
const mask = (mask: string, value: string, text: string => {} ) => {}
const unmask = (mask: string, masked: string, unmasked: string => {} ) => {}
const setMask = (node: any, mask: string) => {}
export { mask, unmask, setMask }
export default TextInputMask
Recently I updated Angular from 2.0.3 to 2.4.3 and Angular-CLI from 1.0.0-beta.21 to 1.0.0-beta.25.5
After upgrade my unit tests stop working. Below you can find test file, configuration files and test results. Do you have any idea what can be wrong with it? Thanks
test result
$ npm test -- --watch=false
> portal#0.0.0 test /Users/artur/Sites/portal
> ng test "--watch=false"
19 01 2017 08:22:52.703:WARN [karma]: Port 9879 in use
19 01 2017 08:22:52.705:INFO [karma]: Karma v1.4.0 server started at http://0.0.0.0:9880/
19 01 2017 08:22:52.705:INFO [launcher]: Launching browser Chrome with unlimited concurrency
19 01 2017 08:22:52.726:INFO [launcher]: Starting browser Chrome
19 01 2017 08:22:55.619:INFO [Chrome 55.0.2883 (Mac OS X 10.12.2)]: Connected on socket XIi2HWa92rY4uvNvAAAA with id 35735618
Chrome 55.0.2883 (Mac OS X 10.12.2): Executed 0 of 0 ERROR (0.004 secs / 0 secs)
npm ERR! Test failed. See above for more details.
banner.component.spec.ts
/* tslint:disable:no-unused-variable */
import { Component } from '#angular/core';
import { TestBed, async } from '#angular/core/testing';
import { BannerComponent } from './banner.component';
import { RouterTestingModule } from '#angular/router/testing';
#Component({
template: ''
})
class DummyComponent {}
describe('Component: Banner', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [
DummyComponent,
BannerComponent
],
imports: [
RouterTestingModule.withRoutes([
{ path: '', component: DummyComponent }
])
],
providers: []
});
});
it('should create an instance', async(() => {
let fixture = TestBed.createComponent(BannerComponent);
let component = fixture.debugElement.componentInstance;
expect(component).toBeTruthy();
}));
});
banner.component.ts
import { Component, OnInit } from '#angular/core';
#Component({
selector: 'app-banner',
templateUrl: './banner.component.html',
styleUrls: ['./banner.component.scss'],
styles: [".banner >>> lp-svg svg path { fill: #fcfcfc; }"]
})
export class BannerComponent {}
package.json
{
"name": "portal",
"version": "0.0.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
"ngc": "./node_modules/.bin/ngc -p ./src",
"start": "./node_modules/.bin/ng serve --host 0.0.0.0 --port 4000",
"build.dev": "./node_modules/.bin/ng build --bh /portal/",
"build.dev.watch": "./node_modules/.bin/ng build --bh /portal/ --watch true",
"build.prod": "./node_modules/.bin/ng build --bh /portal/ --prod --env=prod",
"build.prod.watch": "./node_modules/.bin/ng build --bh /portal/ --prod --env=prod",
"serve.prod": "node lp-server.js",
"lint": "tslint \"src/**/*.ts\"",
"test": "./node_modules/.bin/ng test",
"e2e": "./protractor.sh",
"copy.support-page": "./node_modules/.bin/copyfiles -u 1 ./src/support.html ./dist"
},
"private": true,
"dependencies": {
"#angular/common": "^2.4.3",
"#angular/compiler": "^2.4.3",
"#angular/compiler-cli": "^2.4.3",
"#angular/core": "^2.4.3",
"#angular/forms": "^2.4.3",
"#angular/http": "^2.4.3",
"#angular/platform-browser": "^2.4.3",
"#angular/platform-browser-dynamic": "^2.4.3",
"#angular/platform-server": "^2.4.3",
"#angular/router": "^3.4.3",
"copyfiles": "1.0.0",
"core-js": "2.4.1",
"jquery": "2.2.3",
"perfect-scrollbar": "~0.6.10",
"rxjs": "^5.0.3",
"ts-helpers": "1.1.1",
"typescript": "2.0.2",
"underscore": "1.8.3",
"zone.js": "0.6.23"
},
"devDependencies": {
"#types/jasmine": "^2.5.41",
"angular-cli": "^1.0.0-beta.25.5",
"codelyzer": "^2.0.0-beta.4",
"jasmine-core": "^2.5.2",
"jasmine-spec-reporter": "^3.2.0",
"karma": "^1.4.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.1.0",
"karma-mocha-reporter": "^2.2.1",
"karma-phantomjs-launcher": "^1.0.2",
"karma-remap-istanbul": "^0.4.0",
"live-server": "1.1.0",
"protractor": "^5.0.0",
"ts-node": "1.2.1",
"tslint": "3.13.0"
}
}
karma.conf.js
// Karma configuration file, see link for more information
// https://karma-runner.github.io/0.13/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', 'angular-cli'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-phantomjs-launcher'),
require('karma-remap-istanbul'),
require('angular-cli/plugins/karma'),
require('karma-mocha-reporter')
],
files: [
{ pattern: 'src/test.ts', watched: false },
{ pattern: 'src/assets/img/*', watched: false, included: false, served: true, nocache: false }
],
proxies: {
'/portal/assets/img/': '/base/src/assets/img/'
},
preprocessors: {
'./src/test.ts': ['angular-cli']
},
remapIstanbulReporter: {
reports: {
html: 'coverage',
lcovonly: './coverage/coverage.lcov'
}
},
angularCli: {
config: './angular-cli.json',
environment: 'dev'
},
reporters: config.angularCli && config.angularCli.codeCoverage
? ['progress', 'karma-remap-istanbul']
: ['progress'],
port: 9879,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
browserConsoleLogOptions: {
level: 'debug',
format: '%b %T: %m',
terminal: true
},
customLaunchers: {
'PhantomJS_custom': {
base: 'PhantomJS',
options: {
windowName: 'my-window',
settings: {
webSecurityEnabled: false
},
},
flags: ['--load-images=true'],
debug: true
}
},
phantomjsLauncher: {
// Have phantomjs exit if a ResourceError is encountered (useful if karma exits without killing phantom)
exitOnResourceError: true
}
});
};
angular-cli.json
{
"project": {
"version": "1.0.0-beta.25.5",
"name": "ui-lender-portal-v2"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": ["assets"],
"index": "index.html",
"main": "main.ts",
"test": "test.ts",
"tsconfig": "tsconfig.json",
"prefix": "lp",
"mobile": false,
"styles": [
"styles.scss",
"../node_modules/perfect-scrollbar/dist/css/perfect-scrollbar.min.css"
],
"scripts": [
"../node_modules/underscore/underscore.js",
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/perfect-scrollbar/dist/js/perfect-scrollbar.js",
"./libs/jquery-ui/jquery-ui.min.js",
"./libs/jquery-mobile/jquery.mobile.custom.min.js",
"./libs/slick/slick.js"
],
"environments": {
"source": "environments/environment.ts",
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"addons": [],
"packages": [],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"prefixInterfaces": false,
"inline": {
"style": false,
"template": false
},
"spec": {
"class": false,
"component": true,
"directive": true,
"module": false,
"pipe": true,
"service": true
}
}
}
Finally I created new project with Angular-CLI and copied source files from my project. This helps.