Dragged element is not rendered correctly when `constrainDragToTimeline` disabled

[chuckn0rris]

Test case BryntumDragIssue (1).zip If not runnable with yarn, change version in package.json for yarn from 4.0.4 to 1.2.0 (or whatever you have locally)

Worked when constraints enabled, but doesn't when it disabled. An app attached is on Angular, but it is required to be reviewed by Core developer, not Angular.

Forum post

We are using Brynutm Scheduler 6.0.1 with Angular 17 and have implemented the scheduler with our own renderer component:

const EVENT_COMPONENT_SELECTOR = getComponentSelector(SchedulingBoardEventComponent);

export const eventRendererConfig = {
  eventColor: null,
  eventRenderer: (): string => `<${EVENT_COMPONENT_SELECTOR} />`,
  onRenderEvent: ({ eventRecord, element: parentElement }): void => {
    const data = (eventRecord as SchedulingBoardModel<SchedulingBoardItem>).getData('data');
    const element = findFirstElementOrThrow<SchedulingBoardComponentWithData<SchedulingBoardItem>>(
      EVENT_COMPONENT_SELECTOR,
      parentElement,
    );
    element.data = data;
  },
} satisfies SchedulerConfig;

Everything is working fine, until we deactivate constrainDragToTimeline and set it to false to be able to drag between to connected schedulers.

Our custom renderer component has the following template:

<div *ngIf="data; else dragCreationElement">
  <app-scheduling-board-creation-card
    *ngIf="data.modelType === SchedulingBoardItemTypeEnum.CREATION"
    [subject]="data.subject"
    [color]="data.color"
  />

  <app-work-order-card-scheduling
    *ngIf="data.modelType === SchedulingBoardItemTypeEnum.WORK_ORDER"
    [workOrder]="data"
    [hasNoBackground]="!(showFullyColoredCards$ | async)"
  />
</div>

<ng-template #dragCreationElement>
  <app-scheduling-board-creation-card />
</ng-template>

and once we set constrainDragToTimeline to false and start to drag, it is always rendering the fallback component as if it doesn't get the data. While debugging, we noticed, that the eventRenderer and also the onRenderEvent are not called so we assume the data is not correctly inserted. In the Dom, we can see, that the data is set correctly on the bryntum divs but apparently not forwarded.

Here is a screen shot of the scheduling board while dragging:

Screenshot of the Dom element while dragging: https://drive.google.com/file/d/1RbabIV5pWADdbZDu65wCEIrl1bzPgyJm/view?usp=drive_link

Any idea, what we can do to fix the rendering while dragging?

Thank you!