DayPilot in lit-element (Web Components)

Asked by Simon
4 years ago.

Hi,

I want to integrate the DayPilot Scheduler into a lit-element (https://lit-element.polymer-project.org/guide/start) so that I can use it as a web component. The initialization works fine and even the theme is loaded correctly, but as soon as I hover the scheduler the console spits out error-messages and the events can't be moved around.

(The line numbers are from Chromes formatted source file feature)

daypilot-all.min.js:formatted:34152 Uncaught TypeError: Cannot set property 'grid' of null
at DayPilot.Scheduler.Mm (daypilot-all.min.js:formatted:34152)
at HTMLDivElement.wc (daypilot-all.min.js:formatted:33096)
Mm @ daypilot-all.min.js:formatted:34152
wc @ daypilot-all.min.js:formatted:33096

I use DayPilot Pro for JavaScript 2020.1.4258 (trial). Attached is the class I wrote, based on the demo.

Thanks for your help!

bug javascript

dispo-scheduler.js

Comment posted by Dan Letecky [DayPilot]
4 years ago.

This error comes from the code that calculates the relative mouse position. The reference element is not part of the page DOM (likely because of the shadow DOM) and that's why the calculation fails.

Comment posted by Simon
4 years ago.

Is there a way around that?

Comment posted by Simon
4 years ago.

I've made an interesting observation: Everything works fine with a very old version (8.0.1514).
But obviously, I would prefer to use a more recent version.

Comment posted by Dan Letecky [DayPilot]
4 years ago.

Can you give it a try with the latest sandbox build (2020.1.4262)?
https://javascript.daypilot.org/sandbox/

Answer posted by Simon
4 years ago.

Yes, that fixes it. When is the next release planed?

After having worked with many different companies offering similar services I have to say: extraordinary work! Thanks a lot!

Comment posted by Dan Letecky [DayPilot]
4 years ago.

It's nice to hear that!

The next release will be available on March 1:
https://release.daypilot.org/changes/js/

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.

DayPilot in lit-element (Web Components)

Products

Learn

Get Support

DayPilot Pro