Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error when updating from 0.24.5 to 0.25.2 and higher #191

Closed
theVannu opened this issue Jul 11, 2018 · 15 comments

Comments

Projects
None yet
2 participants
@theVannu
Copy link

commented Jul 11, 2018

Hi all guys,
I have a very strange (and probably stupid) problem that I am not able to resolve.
I have updated vuex-orm from 0.24.5 to 0.25.1, all run well. Then I try to update from 0.25.1 to 0.25.2 and my Vue application doesn't run, here the console error:

TypeError: parent.database(...) is undefined[Ulteriori informazioni] bundle.js:5505:33 Puzzle</Schema.buildMorphOne http://localhost:97/bundle.js:5505:33 Puzzle</Schema.buildRelations http://localhost:97/bundle.js:5470:20 Puzzle</Schema.definition/< http://localhost:97/bundle.js:5437:23 reduce self-hosted:365:27 Puzzle</Schema.definition http://localhost:97/bundle.js:5435:16 Puzzle</Schema.one http://localhost:97/bundle.js:5418:26 Puzzle</Schema.many http://localhost:97/bundle.js:5427:32 Puzzle</Schema.buildMany http://localhost:97/bundle.js:5498:41 Puzzle</Schema.buildRelations http://localhost:97/bundle.js:5458:20 Puzzle</Schema.definition/< http://localhost:97/bundle.js:5437:23 reduce self-hosted:365:27 Puzzle</Schema.definition http://localhost:97/bundle.js:5435:16 Puzzle</Schema.one http://localhost:97/bundle.js:5418:26 Puzzle</Schema.many http://localhost:97/bundle.js:5427:32 Puzzle</Schema.buildMany http://localhost:97/bundle.js:5498:41 Puzzle</Schema.buildRelations http://localhost:97/bundle.js:5458:20 Puzzle</Schema.definition/< http://localhost:97/bundle.js:5437:23 reduce self-hosted:365:27 Puzzle</Schema.definition http://localhost:97/bundle.js:5435:16 Puzzle</Schema.one http://localhost:97/bundle.js:5418:26 Puzzle</Database.prototype.createSchema/< http://localhost:97/bundle.js:5598:42 forEach self-hosted:268:13 Puzzle</Database.prototype.createSchema http://localhost:97/bundle.js:5597:9 Puzzle</Database.prototype.start http://localhost:97/bundle.js:5530:9 Puzzle</install/< http://localhost:97/bundle.js:672:9 Store/< http://localhost:97/bundle.js:52947:46 forEach self-hosted:268:13 Store http://localhost:97/bundle.js:52947:3 Puzzle< http://localhost:97/bundle.js:22396:58 __webpack_require__ http://localhost:97/bundle.js:21:12 Puzzle< http://localhost:97/bundle.js:52195:70 __webpack_require__ http://localhost:97/bundle.js:21:12 Puzzle< http://localhost:97/bundle.js:43322:18 __webpack_require__ http://localhost:97/bundle.js:21:12 Puzzle< http://localhost:97/bundle.js:64:18 <anonimo> http://localhost:97/bundle.js:2:11

Then I try to update from 0.25.2 to latest 0.25.5, now My Vuejs App start but my vuex-orm models are empty!

I notice that just getters are running. I can't dispatch any action (insert, create etc) instead.
I also read every release changes but I'm not really understund what is happening. Anyone have any ideas?
Thank you

@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 12, 2018

Hi! Sorry for the inconvenience. That error wouldn't show up on 0.25.5. I have no idea why dispatch is not working. Could you provide me the model definition and how you dispatch actions?

@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 12, 2018

Hello @kiaking , thanks for reply. I show you a reduce version of my model because it's easier to read:

 export default class Bodies extends Model {
    static entity = 'bodies'
    static primaryKey = 'uniqueID'

    static fields() {
        return {
            uniqueID: this.attr('iduniquebody'),
            descr: this.attr(''),
            attributes: this.hasOne(BodyAttributes, 'body_id'),
            children: this.hasMany(Section, 'body_id')
        }
    }
} 

export default class BodyAttributes extends Model {
    static entity = 'bodiesattributes'
    static primaryKey = 'uniqueID'

    static fields(){
        return {
            uniqueID: this.attr(null),
            body_id: this.attr('iduniquebody'),
            'background-color': this.attr('')
        }
    }
}

export default class Section extends Model {
    static entity = 'sections'
    static primaryKey = 'uniqueID'

    static fields() {
        return {
            uniqueID: this.attr('qwertyu'),
            descr: this.attr(null),
            attributes: this.hasOne(SectionAttributes,'section_id'),
            body_id: this.attr('iduniquebody'),
            children: this.hasMany(Column, 'section_id')
        }
    }
}

export default class SectionAttributes extends Model {
    static entity = 'sectionsattributes'
    static primaryKey = 'uniqueID'

    static fields(){
        return {
            uniqueID: this.attr(null),
            section_id: this.attr(null),
            'background-color': this.attr(''),
            'padding-top': this.attr('20px'),
            'padding-left': this.attr('0px'),
            'padding-right': this.attr('0px'),
            'padding-bottom': this.attr('20px'),
            'border-radius': this.attr('0px'),
            'background-url': this.attr(''),
            'background-repeat': this.attr('repeat')
        }
    }
}

As you can see I have a Body Model that have One-to-One relation with BodyAttributes and have a Many relation with Section. Section Model have a One-to-One relations with SectionAttributes and Many relations with Column Model too.
Here my json structure:

{
	"uniqueID": "iduniquebody",
	"attributes": {
		"uniqueID": "idbodyatt",
		"body_id": "iduniquebody",
		"background-color": ""
	},
	"children": [
		{
			"uniqueID": "sezioneinit",
			"body_id": "iduniquebody",
			"descr": "a",
			"attributes": {
				"uniqueID": "idsectionattr",
				"section_id": "sezioneinit",
				"background-color": "",
				"padding-top": "20px",
				"padding-left": "0px",
				"padding-right": "0px",
				"padding-bottom": "20px",
				"border-radius": "0px",
				"background-url": "",
				"background-repeat": "repeat"
			},
			"children": []
		}
	]
}

Now I dispatch a create action, my namespace's name is listEditor

this.$store.dispatch('listEditor/bodies/create', {data})
where data is the previous json structure.
Now I have update vuex-orm to 0.25.5, no errors is thrown but vuex store is empty.

@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 13, 2018

@theVannu Hi! I've tested the exact same model and inserted the same data on my sample project and it is working. The Vuex Store is not empty. Is it possible for you to create reproducible project, or fiddle or something?


screen shot 2018-07-13 at 14 15 23

@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 16, 2018

Unfortunately I am not able to create a reproducible project. When I dispatch the Create actions I get the Json Structure from Vue prototype:

this.$store.dispatch('listEditor/bodies/create', {data: this.$myjson})
where myjson is the json object that I want insert into models, can this be a problem in your opinion?

I have tried another super-simple thing:
this.$store.dispatch('listEditor/bodies/create', {uniqueID:'testid'})

just a create action that create the uniqueID field into Body Model, nothing to do, my store is empty again! Very strange

@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 17, 2018

@theVannu Hi! Maybe it's just a typo, but for the second example, you need to pass JSON object to the data property. Could this be the problem?

this.$store.dispatch('listEditor/bodies/create', { data: { uniqueID: 'testid' } })
@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 17, 2018

Unfortunately this not resolve the problem: I have done another simple test. I rewrite my Model Body and remove all others Models:

import { Model } from '@vuex-orm/core'

export default class Bodies extends Model {
    static entity = 'bodies'
    static primaryKey = 'uniqueID'

    static fields() {
        return {
            uniqueID: this.attr('iduniquebody'),
            descr: this.attr(''),           
            tagName: this.attr('mj-body')          
        }
    }
}

I dispatch my create action:
this.$store.dispatch('listEditor/bodies/create', {data: {uniqueID: "iduniquebody"}})

and now I have an error:
TypeError: query.model is undefined

the problem is inside this function, where entity var is evaluate:

var Normalizer = /** @class */ (function () {
    function Normalizer() {
    }
    /**
     * Normalize the data given data.
     */
    Normalizer.process = function (query, record) {
        if (Utils.isEmpty(record)) {
            return {};
        }
        var entity = query.database().schemas[query.model.entity];
        var schema = Array.isArray(record) ? [entity] : entity;
        return src_2(record, schema).entities;
    };
    return Normalizer;
}());
@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 17, 2018

OK, that error gets thrown when models are not registered correctly. Could you give me the code where you register models to the database via database.register method?

@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 17, 2018

Ok! First error is that model's name is not Bodies, the correct name is Body.

This is my model registration (databaseed.js):

import { Database } from '@vuex-orm/core'
import Body from './models/Body'
import bodies from './modules/bodies'
const databaseed = new Database()
databaseed.register(Body, bodies)
export default databaseed

This is my store.js file, where I install plugin into Vuex:

import Vue from 'vue'
import Vuex from 'vuex'

import VuexORM from '@vuex-orm/core'
import databaseed from './databaseed'
import databasestylepanel from './databasestylepanel'
import databaseglobalsetting from './databaseglobalsetting'

Vue.use(Vuex)


const store = new Vuex.Store({
    plugins: [
        VuexORM.install(databaseed, {namespace: 'listEditor'}),
        VuexORM.install(databasestylepanel, {namespace: 'stylePanel'}),
        VuexORM.install(databaseglobalsetting, {namespace: 'globalSetting'})
    ]
})
export default store

As you can see I have registered more databases.

Finally I import my store.js into main.js (the entry point of my app)

import store from './vuex/store';
import vuexI18n from 'vuex-i18n';
Vue.use(vuexI18n.plugin, store); //I register in the store another plugin

...other import...

application = new Vue({
        store,
        el: '#app',
        template: '<App/>',
        components: {App}
    })
@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 17, 2018

Oh... I see now. OK You have multiple databases. OK. Sorry, that was a breaking change introduced at 0.25.2. It wasn't perfect before that, but I made database handling little cleaner.

Is it possible for you to merge those databases into one single database? Will there be name conflict? Maybe I need to bring back multiple database registration but need to think a bit about architecture (There is another issue on this as well).

@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 17, 2018

I can't merge into one single database because I have name conflict between listEditor and globalSetting. Probably I can rename the modela and entities of globalSetting and merge all into one Database. Do you suggest me to merge Database and update to 0.25.5 or I can safely use 0.24.5 with multiple database (and wait for multi database registration in the next versions ) ?

@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 17, 2018

I would recommend merging Database to one. This is due to the fact Vuex is not supporting multiple Store instance. I want to be as flexible as possible, but this discussion might take a while before we can find any solid answer.

Also, multiple database at 0.24.5 is not perfect as well (it wouldn't work with multiple Store instance I think). So sorry for your inconvenience but because of those reasons, I'll recommend using single database for now 😢

@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 17, 2018

Thank you a lot @kiaking , you help me a lot. Your package is great and you do a great work ( I think that vuex-orm should be an official and supported repo of VueJS). I am going to merge my databases changing models and entities name. Have a nice day ;)

@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 17, 2018

Thank you so much for the kind word!!! I hope it works for you. I'll do my best to continue improving the package!

@theVannu

This comment has been minimized.

Copy link
Author

commented Jul 17, 2018

Probelm fix, now all work as excpected! thank you

@kiaking

This comment has been minimized.

Copy link
Member

commented Jul 18, 2018

Great!!! I'm glad to see it worked for you! Please feel free to open another issue if you have any trouble! 👍

@kiaking kiaking closed this Jul 18, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.