enso-ui / ui

Laravel Enso UI
MIT License
9 stars 10 forks source link

[Vue warn]: Error in render: "TypeError: Cannot read property 'datasets' of undefined" #35

Closed robbykrlos closed 4 years ago

robbykrlos commented 4 years ago

This is a bug.

Prerequisites

Description

I don't believe this is an Enso bug, but maybe it happens to others, and maybe you can help with some hints.

Since we started the our project based on enso we did not change any dashboard details.

Since we've upgraded to approx 3.8.0 (could be one version previous to this one, not 100% sure) dashboard fails with:

image

vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in render: "TypeError: Cannot read property 'datasets' of undefined"

found in

---> <ChartCard> at node_modules/@enso-ui/charts/src/bulma/ChartCard.vue
       <EnsoChartCard> at node_modules/@enso-ui/charts/src/bulma/EnsoChartCard.vue
         <Index> at node_modules/@enso-ui/ui/src/bulma/pages/dashboard/Index.vue
           <MainRouter> at node_modules/@enso-ui/ui/src/bulma/pages/MainRouter.vue
             <Default> at node_modules/@enso-ui/ui/src/core/layouts/Default.vue
               <Default> at node_modules/@enso-ui/ui/src/bulma/layouts/Default.vue
                 <Fade> at node_modules/@enso-ui/transitions/src/transitions/Fade.vue
                   <CoreApp> at node_modules/@enso-ui/ui/src/core/App.vue
                     <Root>
[...]
vue.runtime.esm.js?2b0e:1888 TypeError: Cannot read property 'datasets' of undefined
    at VueComponent.data (ChartCard.vue?dae0:127)
    at Watcher.get (vue.runtime.esm.js?2b0e:4479)
    at Watcher.evaluate (vue.runtime.esm.js?2b0e:4584)
    at VueComponent.computedGetter [as data] (vue.runtime.esm.js?2b0e:4836)
    at Object.get (vue.runtime.esm.js?2b0e:2072)
    at Proxy.render (eval at ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"1bb7c4be-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./node_modules/@enso-ui/charts/src/bulma/ChartCard.vue?vue&type=template&id=2f9e1ca3& (13.js:155), <anonymous>:76:33)
    at VueComponent.Vue._render (vue.runtime.esm.js?2b0e:3548)
    at VueComponent.updateComponent (vue.runtime.esm.js?2b0e:4066)
    at Watcher.get (vue.runtime.esm.js?2b0e:4479)
    at Watcher.run (vue.runtime.esm.js?2b0e:4554)

After debugging it seems that the response from "data": enso\client\node_modules\@enso-ui\charts\src\bulma\ChartCard.vue

axios.get(this.source, { params: this.params })
                .then(({ data }) => {

is:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="icon" type="image/png" href="/images/favicon.png">
    <title>Enso</title>
<link href="/js/chunk-0283c6f6.a1f8ffef.js" rel="prefetch"><link href="/js/chunk-04b46443.2c8e4c3b.js" rel="prefetch"><link href="/js/chunk-0530a976.41eadf56.js" rel="prefetch"><link href="/js/chunk-055e33dc.3e77b7dc.js" rel="prefetch"><link href="/js/chunk-0ce6c9d6.11ee80c9.js" rel="prefetch"><link href="/js/chunk-13c797ce.a074d775.js" rel="prefetch"><link href="/js/chunk-13c8efd2.f3b97130.js" rel="prefetch"><link href="/js/chunk-13cb3914.5afae645.js" rel="prefetch"><link href="/js/chunk-13cc93ca.f0eb5af9.js" rel="prefetch"><link href="/js/chunk-13f1f400.82595e46.js" rel="prefetch"><link href="/js/chunk-13f3b27a.2d7932f5.js" rel="prefetch"><link href="/js/chunk-13f44214.1e3c1342.js" rel="prefetch"><link href="/js/chunk-13f5b158.42915579.js" rel="prefetch"><link href="/js/chunk-13f7ebda.cb5a1e6a.js" rel="prefetch"><link href="/js/chunk-16485ad0.e9784986.js" rel="prefetch"><link href="/js/chunk-1d55b961.466e5350.js" rel="prefetch"><link href="/js/chunk-1e38eeb2.c40d4bb0.js" rel="prefetch"><link href="/js/chunk-20c1e41a.b931106c.js" rel="prefetch"><link href="/js/chunk-20f5667f.eb961bc9.js" rel="prefetch"><link href="/js/chunk-211041e5.1790841d.js" rel="prefetch"><link href="/js/chunk-2214028a.1690e6f7.js" rel="prefetch"><link href="/js/chunk-221d4d7d.4b42e4d1.js" rel="prefetch"><link href="/js/chunk-22903f83.b6940b7b.js" rel="prefetch"><link href="/js/chunk-2536f243.9e98b5eb.js" rel="prefetch"><link href="/js/chunk-27328846.224f4c26.js" rel="prefetch"><link href="/js/chunk-2838fa28.c38f34cd.js" rel="prefetch"><link href="/js/chunk-2b7284c7.f2ce556c.js" rel="prefetch"><link href="/js/chunk-2d0b2879.0913d3a9.js" rel="prefetch"><link href="/js/chunk-2d0b652a.65a8e717.js" rel="prefetch"><link href="/js/chunk-2d0b99e7.a434f2c2.js" rel="prefetch"><link href="/js/chunk-2d0ba2c9.4eced20e.js" rel="prefetch"><link href="/js/chunk-2d0bae5d.70faa083.js" rel="prefetch"><link href="/js/chunk-2d0bd7e6.8bc74c5d.js" rel="prefetch"><link href="/js/chunk-2d0bff22.6bb91a78.js" rel="prefetch"><link href="/js/chunk-2d0c0df3.5a9da1b7.js" rel="prefetch"><link href="/js/chunk-2d0c4d88.d4ea05ea.js" rel="prefetch"><link href="/js/chunk-2d0c810f.8e827ea0.js" rel="prefetch"><link href="/js/chunk-2d0c87c8.bb03b8e2.js" rel="prefetch"><link href="/js/chunk-2d0c89f9.ec56fc71.js" rel="prefetch"><link href="/js/chunk-2d0cbe18.013f83be.js" rel="prefetch"><link href="/js/chunk-2d0cf299.888c6576.js" rel="prefetch"><link href="/js/chunk-2d0cf4c0.e41dc469.js" rel="prefetch"><link href="/js/chunk-2d0cf639.2d96e0a9.js" rel="prefetch"><link href="/js/chunk-2d0cfc24.16a79931.js" rel="prefetch"><link href="/js/chunk-2d0d0429.ba89567c.js" rel="prefetch"><link href="/js/chunk-2d0d0958.e9377729.js" rel="prefetch"><link href="/js/chunk-2d0d6e94.3d06b4a1.js" rel="prefetch"><link href="/js/chunk-2d0d7c68.53498c16.js" rel="prefetch"><link href="/js/chunk-2d0e4a43.6ae5ebbc.js" rel="prefetch"><link href="/js/chunk-2d0e4e61.2c541c15.js" rel="prefetch"><link href="/js/chunk-2d0e8801.d3a07cda.js" rel="prefetch"><link href="/js/chunk-2d0f043c.88420330.js" rel="prefetch"><link href="/js/chunk-2d0f0a23.93090f04.js" rel="prefetch"><link href="/js/chunk-2d207423.10acbf5e.js" rel="prefetch"><link href="/js/chunk-2d207efa.7445334a.js" rel="prefetch"><link href="/js/chunk-2d208c2b.10672bc0.js" rel="prefetch"><link href="/js/chunk-2d208feb.1ab113d7.js" rel="prefetch"><link href="/js/chunk-2d20f6f8.5bb4706a.js" rel="prefetch"><link href="/js/chunk-2d213544.9947e1ff.js" rel="prefetch"><link href="/js/chunk-2d216436.f093ce67.js" rel="prefetch"><link href="/js/chunk-2d21b0dc.04a583ab.js" rel="prefetch"><link href="/js/chunk-2d221b76.e9209dcb.js" rel="prefetch"><link href="/js/chunk-2d2221c5.b7dedd26.js" rel="prefetch"><link href="/js/chunk-2d225c6f.065c8346.js" rel="prefetch"><link href="/js/chunk-2d22cb00.8bb12092.js" rel="prefetch"><link href="/js/chunk-2ded2f53.9c43b4c5.js" rel="prefetch"><link href="/js/chunk-2eae5c82.10161636.js" rel="prefetch"><link href="/js/chunk-2f46b84b.1a6da4e4.js" rel="prefetch"><link href="/js/chunk-2fbc2c9b.e5926a63.js" rel="prefetch"><link href="/js/chunk-38790dba.fa57e74b.js" rel="prefetch"><link href="/js/chunk-38f5a8be.9c5518e2.js" rel="prefetch"><link href="/js/chunk-3a4110ed.3f11b81f.js" rel="prefetch"><link href="/js/chunk-3e86deab.71095136.js" rel="prefetch"><link href="/js/chunk-41d8a200.4c35ec85.js" rel="prefetch"><link href="/js/chunk-436ffa20.b8a86e27.js" rel="prefetch"><link href="/js/chunk-463dfce0.b400651b.js" rel="prefetch"><link href="/js/chunk-480c9cc2.89ce9037.js" rel="prefetch"><link href="/js/chunk-48851966.16134f77.js" rel="prefetch"><link href="/js/chunk-49eeaee9.1807dbd5.js" rel="prefetch"><link href="/js/chunk-4c14711d.cda056ba.js" rel="prefetch"><link href="/js/chunk-4e80b0a1.b7210030.js" rel="prefetch"><link href="/js/chunk-52ed4435.344d2c25.js" rel="prefetch"><link href="/js/chunk-52ed6822.d504bbff.js" rel="prefetch"><link href="/js/chunk-5710d3f7.e6e78f6c.js" rel="prefetch"><link href="/js/chunk-5a7a629e.4869eadc.js" rel="prefetch"><link href="/js/chunk-5adaed81.51f625ed.js" rel="prefetch"><link href="/js/chunk-5b66fde6.916ea669.js" rel="prefetch"><link href="/js/chunk-5c35ecd7.def412c7.js" rel="prefetch"><link href="/js/chunk-5da185aa.b439dd28.js" rel="prefetch"><link href="/js/chunk-5fe022d4.5e69bb44.js" rel="prefetch"><link href="/js/chunk-62587fc6.88efff23.js" rel="prefetch"><link href="/js/chunk-635a1c8f.a9d1aaf4.js" rel="prefetch"><link href="/js/chunk-6494577c.e1ce5828.js" rel="prefetch"><link href="/js/chunk-67460a1c.1f9b0b96.js" rel="prefetch"><link href="/js/chunk-67b8ac1d.94a91127.js" rel="prefetch"><link href="/js/chunk-6ae76eb5.d24eb9e5.js" rel="prefetch"><link href="/js/chunk-6b09b33a.9ac91d65.js" rel="prefetch"><link href="/js/chunk-6c0ef479.47fe69c1.js" rel="prefetch"><link href="/js/chunk-6e586e04.11afb5c3.js" rel="prefetch"><link href="/js/chunk-6f1e9dae.64715057.js" rel="prefetch"><link href="/js/chunk-6f94585e.5a927f1d.js" rel="prefetch"><link href="/js/chunk-70a2c4ca.b2f5567e.js" rel="prefetch"><link href="/js/chunk-713daeaa.50e43d21.js" rel="prefetch"><link href="/js/chunk-7144e1bd.6e98cfc7.js" rel="prefetch"><link href="/js/chunk-741611d4.fbe9cba6.js" rel="prefetch"><link href="/js/chunk-7441c5f3.bb4a6d29.js" rel="prefetch"><link href="/js/chunk-7467cd38.0d2142cd.js" rel="prefetch"><link href="/js/chunk-787e1612.98ac5317.js" rel="prefetch"><link href="/js/chunk-799a615a.495e73c0.js" rel="prefetch"><link href="/js/chunk-7b07409e.b33ef36e.js" rel="prefetch"><link href="/js/chunk-7ea9dee2.f538eb76.js" rel="prefetch"><link href="/js/chunk-828186dc.0d383e2a.js" rel="prefetch"><link href="/js/chunk-87c707ba.5c8849a7.js" rel="prefetch"><link href="/js/chunk-9a07bb86.e3602155.js" rel="prefetch"><link href="/js/chunk-a6ca334a.cf70b6e1.js" rel="prefetch"><link href="/js/chunk-b68e0234.ba53d9b4.js" rel="prefetch"><link href="/js/chunk-b81deb9a.fbec7940.js" rel="prefetch"><link href="/js/chunk-c00e5ae8.cf443847.js" rel="prefetch"><link href="/js/chunk-c820dc48.0caaf021.js" rel="prefetch"><link href="/js/chunk-d7f7558e.dcbd205c.js" rel="prefetch"><link href="/js/chunk-db5a2c10.39af82d1.js" rel="prefetch"><link href="/js/chunk-dc0caf36.b2669ea0.js" rel="prefetch"><link href="/js/chunk-dd620e26.245d04d5.js" rel="prefetch"><link href="/js/chunk-e1a1da26.e6a20429.js" rel="prefetch"><link href="/js/chunk-e228bd58.84191d65.js" rel="prefetch"><link href="/js/chunk-e5c91840.bba69f5a.js" rel="prefetch"><link href="/js/chunk-e6520a3a.a59bc0bf.js" rel="prefetch"><link href="/js/chunk-ea78d472.112c47e5.js" rel="prefetch"><link href="/js/chunk-f1e284a0.9c7ce9a2.js" rel="prefetch"><link href="/js/chunk-faa58766.2d758715.js" rel="prefetch"><link href="/js/chunk-fbe216a4.ecb1c997.js" rel="prefetch"><link href="/js/chunk-vendors.ae8ed3ce.js" rel="preload" as="script"><link href="/js/main.4286d5ba.js" rel="preload" as="script"></head>
<body>
<noscript>
    <strong>We're sorry but the frontend doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script type="text/javascript" src="/js/chunk-vendors.ae8ed3ce.js"></script><script type="text/javascript" src="/js/main.4286d5ba.js"></script></body>
</html>

Basically all calls to "/api/dashboard/*" respond with above message.

I'm currently investigating why the fallback to this "enso/resources/views/vendor/laravel-enso/core/index.blade.php" file - and what breaks in between.

Any hints & ideas are welcomed.

Thank you,

aocneanu commented 4 years ago

Are you sure that you followed all upgrade steps? Not long ago we dropped the examples package and the dashboard routes / example controller should be in your local project (look in the repo)

robbykrlos commented 4 years ago

You mean this?

Laravel Enso's Changelog

3.7.1

[...]

deprecated

examples

I guess I've interpreted this "for existing projects that may still use the package, they may continue using it" as "don't need to do anything"

aocneanu commented 4 years ago

Right, I guess that's not accurate. The package does not work with 3.7.1 anymore

aocneanu commented 4 years ago

Are you sure that you followed all upgrade steps? Not long ago we dropped the examples package and the dashboard routes / example controller should be in your local project (look in the repo).

I removed that line.

robbykrlos commented 4 years ago

Thank you for your help and support!