calendar icon indicating copy to clipboard operation
calendar copied to clipboard

SSR render incomplete

Open happyleavesaoc opened this issue 1 year ago • 2 comments

I'm attempting to use event-calendar with sveltekit's SSR-only mode, but the server-rendered calendar is not fully initialized. I suspect that onMount may be the culprit here.

Example component:

<script>
import Calendar from '@event-calendar/core';
import DayGrid from '@event-calendar/day-grid';
import '@event-calendar/core/index.css';

let options = {
    view: 'dayGridMonth',
    events: [
        {start: '2023-11-01', end: '2023-11-02', title: 'event', allDay: true}
    ]
};

</script>

<Calendar options={options} plugins={[DayGrid]} />

Actual output: image

Expected output: image

(this was generated by turning on CSR in addition to SSR)

happyleavesaoc avatar Nov 15 '23 03:11 happyleavesaoc

Yes, unfortunately, that's the way it works now. The event placement algorithm at some points requires information about the size of DOM elements, which becomes available only when rendering these elements in the browser. Also, various optimizations use deferred computation, which is not performed in SSR.

I'll leave this ticket open so that I can improve SSR support over time (if possible).

vkurko avatar Nov 16 '23 14:11 vkurko

Just for reference https://github.com/vkurko/calendar/discussions/162#discussioncomment-6572376

vkurko avatar Nov 16 '23 15:11 vkurko