Cannot read property 'split' of undefined

[karneaud]

Summary of issue

Cannot display permissions tab in Admin/ backend for a User Role

Steps to reproduce

1) Select A User or User Role 2) Select the permissions tab

app.js:1312 [Vue warn]: Error in render: "TypeError: Cannot read property 'split' of undefined"

found in

---> at Modules/User/Assets/js/components/AsgardPermissions.vue

at Modules/User/Assets/js/components/RoleForm.vue warn @ app.js:1312 logError @ app.js:2445 globalHandleError @ app.js:2440 handleError @ app.js:2429 Vue._render @ app.js:5208 updateComponent @ app.js:3497 get @ app.js:3847 run @ app.js:3924 flushSchedulerQueue @ app.js:3686 (anonymous) @ app.js:2545 flushCallbacks @ app.js:2466 Promise.then (async) microTimerFunc @ app.js:2514 nextTick @ app.js:2558 queueWatcher @ app.js:3773 update @ app.js:3914 notify @ app.js:1418 reactiveSetter @ app.js:1743 proxySetter @ app.js:4005 (anonymous) @ app.js:112509 Promise.then (async) fetchPermissions @ app.js:112507 boundFn @ app.js:925 mounted @ app.js:112521 callHook @ app.js:3627 insert @ app.js:4822 invokeInsertHook @ app.js:6596 patch @ app.js:6815 Vue._update @ app.js:3369 updateComponent @ app.js:3497 get @ app.js:3847 Watcher @ app.js:3836 mountComponent @ app.js:3504 Vue$3.$mount @ app.js:9161 Vue$3.$mount @ app.js:11522 Vue._init @ app.js:5302 Vue$3 @ app.js:5391 (anonymous) @ app.js:49652 __webpack_require__ @ app.js:20 (anonymous) @ app.js:49552 __webpack_require__ @ app.js:20 (anonymous) @ app.js:63 (anonymous) @ app.js:66 app.js:2449 TypeError: Cannot read property 'split' of undefined at VueComponent.trans (app.js:115822) at VueComponent.boundFn [as trans] (app.js:924) at VueComponent.parseTranslation (app.js:112485) at Proxy.boundFn (app.js:924) at app.js:112770 at Proxy.renderList (app.js:4404) at app.js:112750 at Proxy.renderList (app.js:4416) at app.js:112655 at Proxy.renderList (app.js:4416) logError @ app.js:2449 globalHandleError @ app.js:2440 handleError @ app.js:2429 Vue._render @ app.js:5208 updateComponent @ app.js:3497 get @ app.js:3847 run @ app.js:3924 flushSchedulerQueue @ app.js:3686 (anonymous) @ app.js:2545 flushCallbacks @ app.js:2466 Promise.then (async) microTimerFunc @ app.js:2514 nextTick @ app.js:2558 queueWatcher @ app.js:3773 update @ app.js:3914 notify @ app.js:1418 reactiveSetter @ app.js:1743 proxySetter @ app.js:4005 (anonymous) @ app.js:112509 Promise.then (async) fetchPermissions @ app.js:112507 boundFn @ app.js:925 mounted @ app.js:112521 callHook @ app.js:3627 insert @ app.js:4822 invokeInsertHook @ app.js:6596 patch @ app.js:6815 Vue._update @ app.js:3369 updateComponent @ app.js:3497 get @ app.js:3847 Watcher @ app.js:3836 mountComponent @ app.js:3504 Vue$3.$mount @ app.js:9161 Vue$3.$mount @ app.js:11522 Vue._init @ app.js:5302 Vue$3 @ app.js:5391 (anonymous) @ app.js:49652 __webpack_require__ @ app.js:20 (anonymous) @ app.js:49552 __webpack_require__ @ app.js:20 (anonymous) @ app.js:63 (anonymous) @ app.js:66

System Details

• Operating System - Linux
• PHP Version - 7.0.32
• Laravel Version - 5.5.43
• Asgardcms/Platform version - 3.x

[ChristianGiupponi]

Did you run npm run dev?

[karneaud]

@ChristianGiupponi Did not think I had to should I be doing this on install? Where should I be running it? Themes? or root?

[ChristianGiupponi]

Do not remember if is necessary after the install, run it in the root

[karneaud]

@ChristianGiupponi if I installed this in production mode could this have caused the error?

[ChristianGiupponi]

Maybe, really never happened that issue so I have no clue. You can also run npm run production if the site is already in production. Did it solve the problem?

[karneaud]

@ChristianGiupponi well I have to npm install first before I npm run anything

[ChristianGiupponi]

yes sure

[nWidart]

Could you try using 4.0.x-dev version on a new install?

[karneaud]

@nWidart can't I need PHP7.0.*

[karneaud]

@ChristianGiupponi tried your suggestion. Did not work

[karneaud]

@nWidart is there anyway to fix this without bumping up to 4?

[karneaud]

What's the difference with running npm run production in the root rather than in the AdminLTE theme?

[karneaud]

The line in questions seems to come from

var array = string.split(".")

[mikemand]

Line number and file name? It might help narrow down where the error is generated.

[karneaud]

It could be here

Would it help to say that I am not using Translations? Can I disable it?

[mikemand]

In this case, translations is referring to Laravel's way of translating a string (say, blog::posts.title.post) into human-readable text (e.g.: Blog Post). As far as I'm aware, there isn't any way to disable them, since it is built into the framework.

In your module's service provider, do you have something like this:

/**
 * Register the service provider.
 *
 * @return void
 */
public function register()
{
    // ...
    $this->app->make('events')->listen(LoadingBackendTranslations::class, function (LoadingBackendTranslations $event) {
    });
    // ...
}

public function boot()
{
    // ...
    $this->publishConfig('blog', 'config');
    $this->publishConfig('blog', 'permissions');
    // ...
}

If you're using translated strings inside your permissions config, you will need to also load the translations into the BackendTranslations event:

$this->app->make('events')->listen(LoadingBackendTranslations::class, function (LoadingBackendTranslations $event) {
    $event->load('posts', array_dot(trans('blog::posts')));
});

This tells Asgard to load the translations from /Modules/Blog/Resources/lang/{your-lang}/posts.php.

[karneaud]

Apparently something was being passed as "undefined" in the code I mentioned. I just hacked it and it was resolved. You guys need to update it I guess.

[nWidart]

What did you hack?