NgRX: "No provider for Store!" after upgrading from14 to 15 - ngrx

After upgrading, I started getting the No provider for Store! error during the bootup of my application.
#NgModule({
declarations: [ ... ],
imports: [
...
StoreModule.forRoot({
offer: offerReducer,
ui: offerUIReducer,
}),
EffectsModule.forRoot([OfferEffects]),
],
providers: [ ... ],
})
export class OfferModule { }
The full stack trace
apps_rita_src_app_offer_offer_module_ts.js:2 Error: Uncaught (in promise): NullInjectorError: NullInjectorError: No provider for Store!
Error: NullInjectorError: No provider for Store!
at NullInjector.get (core.mjs:7599:27) [angular]
at R3Injector.get (core.mjs:8020:33) [angular]
at R3Injector.get (core.mjs:8020:33) [angular]
at R3Injector.get (core.mjs:8020:33) [angular]
at injectInjectorOnly (core.mjs:634:33) [angular]
at Module.ɵɵinject (core.mjs:638:60) [angular]
at Object.EffectsRunner_Factory [as factory] (ngrx-effects.mjs:147:112) [angular]
at R3Injector.hydrate (core.mjs:8121:35) [angular]
at R3Injector.get (core.mjs:8009:33) [angular]
at R3Injector.get (core.mjs:8020:33) [angular]
at injectInjectorOnly (core.mjs:634:33) [angular]
at Module.ɵɵinject (core.mjs:638:60) [angular]
at Object.EffectsRootModule_Factory [as useFactory] (ngrx-effects.mjs:147:112) [angular]
at Object.factory (core.mjs:8208:38) [angular]
at resolvePromise (zone.js:1214:31) [angular]
at resolvePromise (zone.js:1168:17) [angular]
at :4200/polyfills.js:8513:9 [angular]
at :4200/vendor.js:91039:49 [angular]
at AsyncStackTaggingZoneSpec.onInvokeTask (core.mjs:23999:36) [angular]
at Object.onInvokeTask (core.mjs:24300:33) [angular]
at drainMicroTaskQueue (zone.js:588:35) [<root>]
Where the ngrx-effects.mjs:147:112 is:
/** #nocollapse */ Actions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: Actions, deps: [{ token: ScannedActionsSubject }], target: i0.ɵɵFactoryTarget.Injectable });
/** #nocollapse */ Actions.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: Actions, providedIn: 'root' });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: Actions, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}], ctorParameters: function () { return [{ type: i1.Observable, decorators: [{
type: Inject,
args: [ScannedActionsSubject]
}] }]; } });
PS: Moving the store to the root module did not help either...

Related

How to go to a details page via routerLink on Ionic 4?

I'm going (using routerLink) to a details page of an object, but instead of the ID, it appears undefined, and don't know how to do it correctly, this is my code:
Tab routing
{
path: 'book/:id',
loadChildren: '../book-detail/book-detail.module#BookDetailPageModule',
pathMatch: 'full'
}
Page A (FROM):
...
bookId = null
bookRef: AngularFirestoreDocument
constructor(
private route: ActivatedRoute,
private af: AngularFirestore,
private service: BookService
) { }
...
HTML
<ion-card [routerLink]="['/book/', id]" routerDirection="forward">
Page B (TO):
...
ngOnInit() {
this.bookId = this.route.snapshot.paramMap.get('id');
if (this.bookId) {
this.loadBook(this.bookId);
}
}
loadBook(bookId) {
this.af.collection<Book>('books')
.doc<Book>(bookId)
.valueChanges()
.subscribe(data => {
this.book = data
});
}
...
The error I'm getting is:
ERROR Error: Uncaught (in promise): FirebaseError: [code=not-found]:
No document to update:
projects/books-29320f/databases/(default)/documents/books/undefined
FirebaseError: No document to update:
projects/books-29320f/databases/(default)/documents/books/undefined
On my url on my detailspage of the book it says: http://localhost:8100/book/undefined
UPDATED 2:
Book detail module:
const routes: Routes = [
{
path: '',
component: BookDetailPage
}
];
#NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [BookDetailPage]
})
export class BookDetailPageModule {}
You should add :id to BookDetailPage path in BookDetailPageModule :
const routes: Routes = [
{
path: ':id',
component: BookDetailPage
}
];
#NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [BookDetailPage]
})
export class BookDetailPageModule {}
FINALLY RESOLVED:
I didn't know about it's just to put this code:
<ion-card [routerLink]="['book/', book.id]" routerDirection="forward">
Instead of what I did (see on my question)

Login Error in Firebase for Nativescript

Hi i try to instance my password login in nativescript but send me this error:
JS: error con login por email Logging in the user failed. com.google.firebase.FirebaseException: An internal error has occurred. [ {
JS: "error":{
JS: "code": 400,
JS: "message": "USER_NOT_FOUND",
JS: "errors": [
JS: {
JS: "message": "USER_NOT_FOUND",
JS: "domain": "global",
JS: "reason": "invalid"
JS: }
JS: ]
JS: }
JS: } ]
here is my code:
constructor() {
firebase.login({
type: firebase.LoginType.PASSWORD,
passwordOptions: {
email: 'test#test.com',
password: 'test#test.com'
}
}).then((user)=>{
console.dir(user);
}, (error)=>{
console.log("error con login por email "+ error);
}
)
}
can you help me to find why gives me that error?
when I login anonymous doesn't have errors
check if you don't forget to enable email-password login in your firebase instance.
https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/master/docs/AUTHENTICATION.md#email-password-login

fetch doesn't work in jest, and return TypeError: Network request failed

I am trying to migrate from karma + PhantomJS to Jest + jsDom, but I got a problem. all fetch in UT failed in Jest. I am trying to figure out the reason. So I just write a simple UT like this
import fetch from 'isomorphic-fetch';
import $ from 'jquery';
describe('test', () => {
it('should fetch success....', (done) => {
return fetch('http://www.ebay.com/', { method: 'get' })
.then((res) => {
console.log(res);
done();
})
.catch(err => console.log(err));
})
it('should get success....', (done) => {
$.get('http://www.ebay.com/', (res) => {
console.log(res);
done();
}).fail((xhr, statusText, err) => {
console.log(statusText, err);
})
})
})
but still get the error like this
TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (/Users/davidhe/work/activenet/git/aui/node_modules/whatwg-fetch/fetch.js:436:16)
at XMLHttpRequest.callback.(anonymous function) (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/events/EventTa
rget-impl.js:289:32)
at invokeEventListeners (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdo
m/lib/jsdom/living/events/EventTarget-impl.js:219:27)
at invokeInlineListeners (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:166:7)
at EventTargetImpl._dispatch (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:122:7)
at EventTargetImpl.dispatchEvent (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:87
:17)
at XMLHttpRequest.dispatchEvent (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:61:35
)
at dispatchError (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:994:9)
at validCORSHeaders (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:1009:7)
at receiveResponse (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:871:12)
at Request.client.on.res (/Users/davidhe/work/activenet/git/aui/node_modules/jest-environment-jsdom/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:691:38)
at emitOne (events.js:96:13)
at Request.emit (events.js:188:7)
at Request.onRequestResponse (/Users/davidhe/work/activenet/git/aui/node_modules/request/request.js:1074:10)
at emitOne (events.js:96:13)
at ClientRequest.emit (events.js:188:7)
at HTTPParser.parserOnIncomingClient [as onIncoming] (_http_client.js:473:21)
at HTTPParser.parserOnHeadersComplete (_http_common.js:99:23)
at Socket.socketOnData (_http_client.js:362:20)
at emitOne (events.js:96:13)
at Socket.emit (events.js:188:7)
at readableAddChunk (_stream_readable.js:176:18)
at Socket.Readable.push (_stream_readable.js:134:10)
at TCP.onread (net.js:547:20)
this is my package.json
{
devDependencies:{
"jsdom": "^11.0.0",
"babel-jest": "^20.0.3",
"jest": "^20.0.4"
},
"dependencies": {
"isomorphic-fetch": "^2.2.1"
}
"jest": {
"browser": true,
"testEnvironment": "jsdom",
"cacheDirectory": "./node_modules/.cache",
"verbose": true,
"globals": {
"__STATIC__": true,
"__DEV__": false,
"__TESTING__": true
},
"transformIgnorePatterns": [
"/node_modules/(?!react-aaui).+\\.js$"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/test/__mocks__/fileMock.js",
"\\.(css|less)$": "<rootDir>/test/__mocks__/styleMock.js",
"^imports": "<rootDir>/test/__mocks__/jestImportsMock.js"
},
"testRegex": "(fetch\\.(test|spec))\\.(jsx|js)$",
"moduleFileExtensions": [
"json",
"jsx",
"js"
],
"moduleDirectories": [
"node_modules",
"src",
"test"
],
"modulePathIgnorePatterns": [],
"snapshotSerializers": [
"enzyme-to-json/serializer"
],
"collectCoverage": false,
"collectCoverageFrom": [
"src/**/*.{js,jsx}",
"!**/__mocks__/**"
],
"coverageReporters": [
"text",
"html"
],
"coverageDirectory": "test/coverage",
"setupFiles": [
"./test/tests.initialState.jest.js"
],
"testPathIgnorePatterns": [
"/node_modules/",
"/examples/",
"/dist/"
]
}
}
Anyone can help me on it.
I encounter the same issue. And I use fetch-mock to solve it nicely.
import fetchMock from 'fetch-mock'
it ("normally should return success", () => {
fetchMock.getOnce('*', {user: 'ron'})
expect(fetch('http://your.example.com').then(x=>x.json())
.resolves.toEqual({user: 'ron})
})
this question is resolved by add
import { XMLHttpRequest } from 'xmlhttprequest';
global.XMLHttpRequest = XMLHttpRequest;
in tests.initialState.jest.js.
before, I was using w3c-xmlhttprequest, and it doesn't work.
In my case adding the full Url, it didn't show the error.
const login = rest.post('http://localhost:3001/api/auth/login', (req, res, ctx) => {

lazyloader does not works on AOT production mode angular-cli

I am using angular-cli and lazyloader for routing.
ng serve works for me, but after building project as Production mode, then it does not work at all.
Here is my app.routing.ts
import { NgModule } from '#angular/core';
import { Routes, RouterModule } from '#angular/router';
import { MainComponent } from './main/main.component';
import { AuthGuard } from './core/guards/index';
//Layouts
import { LoginComponent } from './login/login.component';
export const routes: Routes = [
{
path: 'login',
component: LoginComponent
},
{
path: '',
component: MainComponent,
children: [
{
path: '',
loadChildren: './main/main.module#MainModule'
}
],
canActivate: [AuthGuard]
},{
path: '**',
redirectTo: 'login'
}
];
#NgModule({
imports: [ RouterModule.forRoot(routes) ],
exports: [ RouterModule ]
})
export class AppRoutingModule {}
And this is error I got after ng build --prod --aot or ng serve --prod.
ERROR Error: Uncaught (in promise): Error: Cannot find module './app/main/main.module'.
Error: Cannot find module './app/main/main.module'.
at t (main.1f6da18….bundle.js:1)
at t.loadAndCompile (vendor.490f84a….bundle.js:379)
at t.load (vendor.490f84a….bundle.js:379)
at t.loadModuleFactory (vendor.490f84a….bundle.js:428)
at t.load (vendor.490f84a….bundle.js:428)
at e.project (vendor.490f84a….bundle.js:428)
at e.XO5T.e._tryNext (vendor.490f84a….bundle.js:897)
at e.XO5T.e._next (vendor.490f84a….bundle.js:897)
at e.next (vendor.490f84a….bundle.js:897)
at e.RRVv.e._subscribe (vendor.490f84a….bundle.js:736)
at t (main.1f6da18….bundle.js:1)
at t.loadAndCompile (vendor.490f84a….bundle.js:379)
at t.load (vendor.490f84a….bundle.js:379)
at t.loadModuleFactory (vendor.490f84a….bundle.js:428)
at t.load (vendor.490f84a….bundle.js:428)
at e.project (vendor.490f84a….bundle.js:428)
at e.XO5T.e._tryNext (vendor.490f84a….bundle.js:897)
at e.XO5T.e._next (vendor.490f84a….bundle.js:897)
at e.next (vendor.490f84a….bundle.js:897)
at e.RRVv.e._subscribe (vendor.490f84a….bundle.js:736)
at u (polyfills.1e19b2c….bundle.js:43)
at u (polyfills.1e19b2c….bundle.js:43)
at polyfills.1e19b2c….bundle.js:43
at t.invokeTask (polyfills.1e19b2c….bundle.js:36)
at Object.onInvokeTask (vendor.490f84a….bundle.js:365)
at t.invokeTask (polyfills.1e19b2c….bundle.js:36)
at r.runTask (polyfills.1e19b2c….bundle.js:36)
at o (polyfills.1e19b2c….bundle.js:36)
Here is screenshot of browser console.
What is wrong on my routing configuration? PP : ng serve is working with out any errors.
This issue is coming from angular2-busy module.
https://www.npmjs.com/package/angular2-busy
Removing this from project solved issue.

Sencha production build failed while using sqlitestorage

In app.js file i have added path of sqlite folder
Ext.Loader.setPath({
'Ext': 'touch/src',
'ConsultLite': 'app',
'Sqlite': 'sqlite'
});
My InitSQLite.js file is
Ext.define('ConsultLite.util.InitSQLite', {
singleton : true,
requires: [
'Sqlite.Connection',
'Sqlite.data.proxy.SqliteStorage',
'Ext.data.reader.Array'
],
initDb: function() {
Ext.ns('DbConnection');
this.DbConnection = Ext.create('Sqlite.Connection', {
dbName: 'ConsultLiteApp',
dbDescription: 'ConsultLiteApp Database',
dbVersion: '1.0',
dbSize: 200000,
});
},
getConnection: function() {
if(!Ext.isDefined(this.DbConnection)) this.initDb();
return this.DbConnection;
}
});
My Model file in which is i have used sqllite proxy
Ext.define('ConsultLite.model.Credential', {
extend: 'Ext.data.Model',
xtype: 'Credential',
config: {
fields: [
{ name : 'id', type : 'int' },
{ name: 'email', type: 'string'},
{ name: 'password', type: 'string'}
],
proxy: {
type: 'sqlitestorage',
dbConfig: {
tablename: 'credential',
dbConn: ConsultLite.util.InitSQLite.getConnection()
}
},
},
});
After executing sencha command "sencha app build production" above error come

Resources