[TIMELINE] Keyboard navigation doesn't work with smart_rendering

#1

Basically what the title says, keyboard navigation doesn’t work properly with smart_rendering set to true.
I’m using Scheduler PRO in Angular 11 app.
This is the error I’m getting:

image
image.png711x210 10.9 KB

The uscase is that I’ve got over 100 sections in timeline view, without smart rendering scheduler load time is way too long but at the same time keyboard navigation is apps must have requirement.

So my question is how can I improve scheduler render time or make keyboard navigation work properly with smart render?

#2

Hello @AverageDev,

I just tested the keyboard navigation with enabled smart rendering, and it works correctly:
http://snippet.dhtmlx.com/5/170733d79

The issue from your screenshot that occurred looks like an old issue from the “v5.1.2”, when you moving the keyboard arrows to the edge of the timeline, and should be fixed in new versions.

So, if the issue just relates to the old scheduler’s version - the easiest way is to update to the fresh one.

btw, also, could you please post a link to the article with the information that the keyboard navigation doesn’t work properly with smart_rendering set to true?

If the issue still reproduces in your app, could you please provide me a simplified demo, which I will be able to run locally and reproduce the issue?

Best regards,

#3

Hi @Siarhei,

Thanks for the reply. :slight_smile:
I’m currently using the newest version of DHTMLX Scheduler which is 5.3.10.

I’ve updated ur example by providing more sections (to trigger smart rendering (?)) which u can find under this link: http://snippet.dhtmlx.com/5/0653d3af2.

Using keyboard navigation (going from section 1 -> 30 & 30 -> 1 with arrows) or moving scrollbar (with mouse) from start to end and then clicking on it again casues following error:

image
image.png1898x393 34.8 KB

Steps to reproduce the error:

Keyboard nav:
Focus timeline cell on first section then use up arrow key or focus timeline cell on last section and then use down arrow key.

Scrollbar & mouse:
Move to the last section with scrollbar then try to use scrollbar again.

#4

Any suggestions how to deal with it?

#5

Hello @AverageDev,

Thank you for the detailed explanation and a demo. I sent it to our dev team and they will work on a fix. Unfortunately, there is no ETA, but I will post any updates on this topic.

Currently, there is no easy way to deal with it, as the “key nav” issue occurs, due this extension tries to access elements, which doesn’t exist due to the “smart_render”(which are out of the viewport).

Also, there are no real opportunities to speed up the rendering of the timeline(excluding the “smart rendering”).
The only option to speed up the rendering of the timeline in this case - is to decrease the count of displayed sections.