element-plus: Unhandled error during execution of render function at

Hi!!! I’m just trying to reproduce the component form absic example and it renders just nice.

This is my wiew:

The problem is that as soon as you click on the time picker, the following error appears with the following warnings:

runtime-dom.esm-bundler-992962aa.js:1176 [Vue warn]: Unhandled error during execution of render function 
  at <ElScrollbar key="hours" ref="listHoursRef" class="el-time-spinner__wrapper"  ... > 
  at <Anonymous ref="spinner" role="start" arrow-control=false  ... > 
  at <BaseTransition appear=false persisted=false onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <Transition name="el-zoom-in-top" type="time" default-value=undefined  ... > 
  at <Anonymous visible=true parsed-value=undefined format="HH:mm:ss"  ... > 
  at <BaseTransition onAfterEnter=fn<onAfterEnter> onAfterLeave=fn<onAfterLeave> appear=false  ... > 
  at <Transition name="el-fade-in-linear" onAfter-enter=fn<onAfterEnter> onAfter-leave=fn<onAfterLeave> > 
  at <ElPopper ref="popper" visible=true onUpdate:visible=fn  ... > 
  at <Picker format="HH:mm:ss" isRange=false type="time"  ... > 
  at <ElTimePicker placeholder="Pick a time" modelValue="" onUpdate:modelValue=fn  ... > 
  at <ElCol span=11 > 
  at <ElFormItem label="Activity time" > 
  at <ElForm ref="form" model= 
{name: "", region: "", date1: "", date2: "", delivery: false, …}
 label-width="120px" > 
  at <Page title="Ingresar corte" > 
  at <Nuevo class="flex-grow overflow-auto" onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
Proxy {onSubmit: ƒ, …}
 > > 
  at <RouterView class="flex-grow overflow-auto" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="slide" mode="out-in" > 
  at <App>
runtime-dom.esm-bundler-992962aa.js:1176 [Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/vue-next 
  at <ElScrollbar key="hours" ref="listHoursRef" class="el-time-spinner__wrapper"  ... > 
  at <Anonymous ref="spinner" role="start" arrow-control=false  ... > 
  at <BaseTransition appear=false persisted=false onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <Transition name="el-zoom-in-top" type="time" default-value=undefined  ... > 
  at <Anonymous visible=true parsed-value=undefined format="HH:mm:ss"  ... > 
  at <BaseTransition onAfterEnter=fn<onAfterEnter> onAfterLeave=fn<onAfterLeave> appear=false  ... > 
  at <Transition name="el-fade-in-linear" onAfter-enter=fn<onAfterEnter> onAfter-leave=fn<onAfterLeave> > 
  at <ElPopper ref="popper" visible=true onUpdate:visible=fn  ... > 
  at <Picker format="HH:mm:ss" isRange=false type="time"  ... > 
  at <ElTimePicker placeholder="Pick a time" modelValue="" onUpdate:modelValue=fn  ... > 
  at <ElCol span=11 > 
  at <ElFormItem label="Activity time" > 
  at <ElForm ref="form" model= 
{name: "", region: "", date1: "", date2: "", delivery: false, …}
 label-width="120px" > 
  at <Page title="Ingresar corte" > 
  at <Nuevo class="flex-grow overflow-auto" onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
Proxy {onSubmit: ƒ, …}
 > > 
  at <RouterView class="flex-grow overflow-auto" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="slide" mode="out-in" > 
  at <App>
runtime-dom.esm-bundler-992962aa.js:1176 [Vue warn]: Property "popperRef" was accessed during render but is not defined on instance. 
  at <ElScrollbar key="hours" ref="listHoursRef" class="el-time-spinner__wrapper"  ... > 
  at <Anonymous ref="spinner" role="start" arrow-control=false  ... > 
  at <BaseTransition appear=false persisted=false onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <Transition name="el-zoom-in-top" type="time" default-value=undefined  ... > 
  at <Anonymous visible=true parsed-value=undefined format="HH:mm:ss"  ... > 
  at <BaseTransition onAfterEnter=fn<onAfterEnter> onAfterLeave=fn<onAfterLeave> appear=false  ... > 
  at <Transition name="el-fade-in-linear" onAfter-enter=fn<onAfterEnter> onAfter-leave=fn<onAfterLeave> > 
  at <ElPopper ref="popper" visible=true onUpdate:visible=fn  ... > 
  at <Picker format="HH:mm:ss" isRange=false type="time"  ... > 
  at <ElTimePicker placeholder="Pick a time" modelValue="" onUpdate:modelValue=fn  ... > 
  at <ElCol span=11 > 
  at <ElFormItem label="Activity time" > 
  at <ElForm ref="form" model= 
{name: "", region: "", date1: "", date2: "", delivery: false, …}
 label-width="120px" > 
  at <Page title="Ingresar corte" > 
  at <Nuevo class="flex-grow overflow-auto" onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
Proxy {onSubmit: ƒ, …}
 > > 
  at <RouterView class="flex-grow overflow-auto" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="slide" mode="out-in" > 
  at <App>
runtime-dom.esm-bundler-992962aa.js:1176 [Vue warn]: Property "popperRef" was accessed during render but is not defined on instance. 
  at <ElScrollbar key="hours" ref="listHoursRef" class="el-time-spinner__wrapper"  ... > 
  at <Anonymous ref="spinner" role="start" arrow-control=false  ... > 
  at <BaseTransition appear=false persisted=false onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <Transition name="el-zoom-in-top" type="time" default-value=undefined  ... > 
  at <Anonymous visible=true parsed-value=undefined format="HH:mm:ss"  ... > 
  at <BaseTransition onAfterEnter=fn<onAfterEnter> onAfterLeave=fn<onAfterLeave> appear=false  ... > 
  at <Transition name="el-fade-in-linear" onAfter-enter=fn<onAfterEnter> onAfter-leave=fn<onAfterLeave> > 
  at <ElPopper ref="popper" visible=true onUpdate:visible=fn  ... > 
  at <Picker format="HH:mm:ss" isRange=false type="time"  ... > 
  at <ElTimePicker placeholder="Pick a time" modelValue="" onUpdate:modelValue=fn  ... > 
  at <ElCol span=11 > 
  at <ElFormItem label="Activity time" > 
  at <ElForm ref="form" model= 
{name: "", region: "", date1: "", date2: "", delivery: false, …}
 label-width="120px" > 
  at <Page title="Ingresar corte" > 
  at <Nuevo class="flex-grow overflow-auto" onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
Proxy {onSubmit: ƒ, …}
 > > 
  at <RouterView class="flex-grow overflow-auto" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="slide" mode="out-in" > 
  at <App>
runtime-dom.esm-bundler-992962aa.js:1176 [Vue warn]: Property "popperRef" was accessed during render but is not defined on instance. 
  at <ElScrollbar key="hours" ref="listHoursRef" class="el-time-spinner__wrapper"  ... > 
  at <Anonymous ref="spinner" role="start" arrow-control=false  ... > 
  at <BaseTransition appear=false persisted=false onBeforeEnter=fn<onBeforeEnter>  ... > 
  at <Transition name="el-zoom-in-top" type="time" default-value=undefined  ... > 
  at <Anonymous visible=true parsed-value=undefined format="HH:mm:ss"  ... > 
  at <BaseTransition onAfterEnter=fn<onAfterEnter> onAfterLeave=fn<onAfterLeave> appear=false  ... > 
  at <Transition name="el-fade-in-linear" onAfter-enter=fn<onAfterEnter> onAfter-leave=fn<onAfterLeave> > 
  at <ElPopper ref="popper" visible=true onUpdate:visible=fn  ... > 
  at <Picker format="HH:mm:ss" isRange=false type="time"  ... > 
  at <ElTimePicker placeholder="Pick a time" modelValue="" onUpdate:modelValue=fn  ... > 
  at <ElCol span=11 > 
  at <ElFormItem label="Activity time" > 
  at <ElForm ref="form" model= 
{name: "", region: "", date1: "", date2: "", delivery: false, …}
 label-width="120px" > 
  at <Page title="Ingresar corte" > 
  at <Nuevo class="flex-grow overflow-auto" onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
Proxy {onSubmit: ƒ, …}
 > > 
  at <RouterView class="flex-grow overflow-auto" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="slide" mode="out-in" > 
  at <App>
element-plus.js:35 Uncaught (in promise) TypeError: Cannot read property 'hour' of undefined
    at element-plus.js:35
    at ComputedRefImpl.reactiveEffect [as effect] (runtime-dom.esm-bundler-992962aa.js:339)
    at ComputedRefImpl.get value [as value] (runtime-dom.esm-bundler-992962aa.js:1116)
    at element-plus.js:35
    at renderList (runtime-dom.esm-bundler-992962aa.js:7916)
    at element-plus.js:35
    at renderFnWithContext (runtime-dom.esm-bundler-992962aa.js:2561)
    at renderSlot (runtime-dom.esm-bundler-992962aa.js:2538)
    at element-plus.js:29
    at renderFnWithContext (runtime-dom.esm-bundler-992962aa.js:2561)

And when you blur it the console shows:

runtime-dom.esm-bundler-992962aa.js:7999 Uncaught (in promise) TypeError: Cannot read property 'insertBefore' of null
    at insert (runtime-dom.esm-bundler-992962aa.js:7999)
    at processCommentNode (runtime-dom.esm-bundler-992962aa.js:4715)
    at patch (runtime-dom.esm-bundler-992962aa.js:4667)
    at componentEffect (runtime-dom.esm-bundler-992962aa.js:5255)
    at Object.reactiveEffect [as update] (runtime-dom.esm-bundler-992962aa.js:339)
    at updateComponent (runtime-dom.esm-bundler-992962aa.js:5144)
    at processComponent (runtime-dom.esm-bundler-992962aa.js:5078)
    at patch (runtime-dom.esm-bundler-992962aa.js:4685)
    at componentEffect (runtime-dom.esm-bundler-992962aa.js:5255)
    at Object.reactiveEffect [as update] (runtime-dom.esm-bundler-992962aa.js:339)

The timepicker does’t show anything. (The datepicker shows the calendar).

My view file is an exact copy of the example above.

And this is my vue main.js file:

import { createApp } from 'vue'
import App from './App.vue'
import './index.scss'
import ElementUI from 'element-plus';
import 'element-plus/lib/theme-chalk/index.css';
import 'element-plus/lib/theme-azure/index.css';
import locale from 'element-plus/lib/locale/lang/es'
import router from './router'
import './assets/styles/index.css'
import store from './store';

const electron = require('electron')
const ipc = electron.ipcRenderer

ipc.send('store:set', { key: 'foo.bar', value: '👩' })
ipc.invoke('store:get', 'foo').then((res) => {
    console.log(res)
})
ipc.send('store:delete', 'foo')
ipc.invoke('store:get', 'foo').then((res) => {
    console.log(res)
})

const app = createApp(App)

app.use(router)
app.use(store)
app.use(ElementUI, { locale })
app.mount('#app')

Also, the datepicker doesn’t seem to throw any error, but when selecting the date, it is not rendering or updating the datepicker view but in the component’s data object, it does, so it is not a big issue, but is anoying hahah.

I need some help to make it work 😕

I’m runing vite and electron with vite-electron-cli;

If you need something more just tell me, thanks.