fix event-placement bugs, rejigger tests

packages-premium

@@ -1 +1 @@
-Subproject commit 7fa3ee3d3c6f3ea5a92dd72de0cc286b8ae32a51
+Subproject commit 98a4627a7446489160993a03d70a822134913100

packages/__tests__/src/event-render/dayGrid-events.ts

@@ -121,43 +121,6 @@ describe('dayGrid advanced event rendering', () => {
     expect(anyElsIntersect(visibleEventEls.concat(moreLinkEls))).toBe(false)
   })
 
-  // https://github.com/fullcalendar/fullcalendar/issues/6187
-  it('will partially slice long events that are beyond dayMaxEvents', () => {
-    let calendar = initCalendar({
-      initialDate: '2020-03-21',
-      initialView: 'dayGridMonth',
-      dayMaxEvents: 3,
-      eventOrder: 'start,title',
-      events: [
-        {
-          title: 'A',
-          start: '2020-03-19',
-        },
-        {
-          title: 'B',
-          start: '2020-03-19',
-        },
-        {
-          title: 'C',
-          start: '2020-03-19',
-        },
-        {
-          title: 'D',
-          start: '2020-03-19',
-          end: '2020-03-21',
-        }
-      ]
-    })
-
-    let dayGridWrapper = new DayGridViewWrapper(calendar).dayGrid
-    let eventEls = dayGridWrapper.getEventEls()
-    let visibleEventEls = filterVisibleEls(eventEls)
-    let moreLinkEls = dayGridWrapper.getMoreEls()
-
-    expect(visibleEventEls.length).toBe(4)
-    expect(moreLinkEls.length).toBe(1)
-  })
-
   it('won\'t intersect when doing custom rendering', () => {
     let calendar = initCalendar({
       initialView: 'dayGridMonth',

packages/__tests__/src/legacy/eventLimit.ts

@@ -73,30 +73,29 @@ describe('dayMaxEventRows', () => { // TODO: rename file
         expect(moreEls[1]).toBeBoundedBy(cells[3])
       })
 
-      it('will render a link in a multi-day event\'s second column ' +
-        'if it has already been hidden in the first',
-      () => {
+      it('will render a pertially hidden single-day event', () => {
         let calendar = initCalendar({
           events: [
             { title: 'event1', start: '2014-07-29', end: '2014-07-31' },
             { title: 'event2', start: '2014-07-29', end: '2014-07-31' },
-            { title: 'event2', start: '2014-07-29', end: '2014-07-31' },
-            { title: 'event2', start: '2014-07-29' },
+            { title: 'event3', start: '2014-07-29', end: '2014-07-31' },
+            { title: 'event4', start: '2014-07-29' },
           ],
         })
         let dayGridWrapper = new ViewWrapper(calendar).dayGrid
+        let eventEls = dayGridWrapper.getEventEls()
+        let visibleEventEls = filterVisibleEls(eventEls)
         let moreEls = dayGridWrapper.getMoreEls()
         let cells = dayGridWrapper.getAllDayEls()
-        expect(moreEls.length).toBe(2)
+        expect(visibleEventEls.length).toBe(3)
+        expect(moreEls.length).toBe(1)
         expect(moreEls[0]).toHaveText('+2 more')
         expect(moreEls[0]).toBeBoundedBy(cells[2])
-        expect(moreEls[1]).toHaveText('+1 more')
-        expect(moreEls[1]).toBeBoundedBy(cells[3])
+
       })
 
-      it('will render a link in a multi-day event\'s second column ' +
-        'if it has already been hidden in the first even if he second column hardly has any events',
-      () => {
+      // https://github.com/fullcalendar/fullcalendar/issues/6187
+      it('will render a partially multi-day hidden event', () => {
         let calendar = initCalendar({
           events: [
             { title: 'event1', start: '2014-07-28', end: '2014-07-30' },
@@ -106,11 +105,14 @@ describe('dayMaxEventRows', () => { // TODO: rename file
           ],
         })
         let dayGridWrapper = new ViewWrapper(calendar).dayGrid
+        let eventEls = dayGridWrapper.getEventEls()
+        let visibleEventEls = filterVisibleEls(eventEls)
         let moreEls = dayGridWrapper.getMoreEls()
         let cells = dayGridWrapper.getDayElsInRow(0)
-        expect(moreEls.length).toBe(3)
-        expect(moreEls[0]).toHaveText('+1 more')
-        expect(moreEls[0]).toBeBoundedBy(cells[1])
+        expect(visibleEventEls.length).toBe(4)
+        expect(moreEls.length).toBe(1)
+        expect(moreEls[0]).toHaveText('+2 more')
+        expect(moreEls[0]).toBeBoundedBy(cells[2])
       })
 
       it('will render a link in place of a hidden single day event, if covered by a multi-day', () => {

packages/common/src/event-placement.ts

@@ -3,10 +3,10 @@ export interface SegInput {
   index: number
   spanStart: number
   spanEnd: number
-  thickness: number
+  thickness: number // should be an integer
 }
 
-export interface SegEntry {
+export interface SegEntry { // might be a sliced version of SegInput
   segInput: SegInput
   spanStart: number
   spanEnd: number
@@ -77,7 +77,7 @@ export class SegHierarchy {
     }
   }
 
-  splitEntry(entry: SegEntry, barrier: SegEntry, hiddenEntries: SegEntry[], forceSplit?: boolean): number {
+  splitEntry(entry: SegEntry, barrier: SegEntry, hiddenEntries: SegEntry[]): number {
     let partCnt = 0
     let splitHiddenEntries: SegEntry[] = []
 
@@ -97,11 +97,11 @@ export class SegHierarchy {
       }, splitHiddenEntries)
     }
 
-    if (partCnt || forceSplit) {
+    if (partCnt) {
       hiddenEntries.push({
         ...entry,
-        spanStart: barrier.spanStart,
-        spanEnd: barrier.spanEnd
+        spanStart: Math.max(barrier.spanStart, entry.spanStart), // intersect
+        spanEnd: Math.min(barrier.spanEnd, entry.spanEnd), // intersect
       }, ...splitHiddenEntries)
       return partCnt
 
@@ -236,49 +236,3 @@ export function binarySearch<Item>(
 
   return [startIndex, 0]
 }
-
-// testing
-// ---------------------------------------------------------------------------------------------------------------------
-
-// document.addEventListener('DOMContentLoaded', function() {
-//   let hierarchyInput: { spanStart: number, spanEnd: number, thickness: number }[] = [
-//     { spanStart: 0, spanEnd: 3, thickness: 2 },
-//     { spanStart: 0, spanEnd: 1, thickness: 1 },
-//     { spanStart: 1, spanEnd: 2, thickness: 10 },
-//     { spanStart: 2, spanEnd: 3, thickness: 1 },
-//     { spanStart: 3, spanEnd: 4, thickness: 10 },
-//     { spanStart: 4, spanEnd: 5, thickness: 1 },
-//     { spanStart: 0, spanEnd: 5, thickness: 2 },
-
-//     // { spanStart: 0, spanEnd: 1, thickness: 1 },
-//     // { spanStart: 1, spanEnd: 2, thickness: 10 },
-//     // { spanStart: 2, spanEnd: 3, thickness: 1 },
-//     // { spanStart: 0, spanEnd: 1, thickness: 1 },
-//     // { spanStart: 2, spanEnd: 4, thickness: 1 },
-//     // { spanStart: 0, spanEnd: 3, thickness: 1 },
-//     // { spanStart: 3, spanEnd: 4, thickness: 1 },
-//     // { spanStart: 3, spanEnd: 4, thickness: 1 },
-//     // { spanStart: 2, spanEnd: 3, thickness: 1 },
-
-//     // { spanStart: 0, spanEnd: 1, thickness: 1 },
-//     // { spanStart: 0, spanEnd: 1, thickness: 1 },
-//     // { spanStart: 0, spanEnd: 1, thickness: 1 },
-//     // { spanStart: 0, spanEnd: 4, thickness: 1 },
-//     // { spanStart: 3, spanEnd: 4, thickness: 1 },
-//     // { spanStart: 3, spanEnd: 4, thickness: 1 }
-//   ]
-// })
-
-// function logRects(rects: SegRect[]) {
-//   console.log('[')
-//   for (let rect of rects) {
-//     console.log(JSON.stringify({
-//       segId: rect.segInput.index + ':' + rect.partId,
-//       spanStart: rect.spanStart,
-//       spanEnd: rect.spanEnd,
-//       levelCoord: rect.levelCoord,
-//       thickness: rect.thickness
-//     }))
-//   }
-//   console.log(']')
-// }

packages/daygrid/src/TableRow.tsx

@@ -52,7 +52,7 @@ export interface TableRowProps {
 interface TableRowState {
   framePositions: PositionCache
   maxContentHeight: number | null
-  eventInstanceHeights: { [instanceId: string]: number }
+  eventInstanceHeights: { [instanceId: string]: number } // integers
 }
 
 export class TableRow extends DateComponent<TableRowProps, TableRowState> {
@@ -343,9 +343,8 @@ export class TableRow extends DateComponent<TableRowProps, TableRowState> {
 
     // get the max height amongst instance segs
     for (let key in segElMap) {
-      let height = segElMap[key].getBoundingClientRect().height
+      let height = Math.round(segElMap[key].getBoundingClientRect().height)
       let instanceId = key.split(':')[0] // deconstruct how renderFgSegs makes the key
-
       eventInstanceHeights[instanceId] = Math.max(eventInstanceHeights[instanceId] || 0, height)
     }
 

packages/daygrid/src/event-placement.ts

@@ -80,7 +80,6 @@ export function computeFgSegPlacement(
     })
 
     for (let col = seg.firstCol; col <= seg.lastCol; col++) {
-      moreCnts[col]++
       singleColPlacements[col].push({
         seg: resliceSeg(seg, col, col + 1, cells),
         isVisible: false,
@@ -273,22 +272,25 @@ class DayGridSegHierarchy extends SegHierarchy {
     if (this.hiddenConsumes && level >= 0) {
       for (let lateral = insertion.lateralStart; lateral < insertion.lateralEnd; lateral++) {
         const leadingEntry = entriesByLevel[level][lateral]
-        const leadingEntryId = buildEntryKey(leadingEntry)
-
-        if (!forceHidden[leadingEntryId]) {
-          forceHidden[leadingEntryId] = true
-
-          if (this.allowReslicing) {
-            // trim down the touchingEntry in the hierarchy. intersect with the new entry
-            entriesByLevel[level][lateral] = {
-              ...leadingEntry,
-              spanStart: Math.max(leadingEntry.spanStart, entry.spanStart),
-              spanEnd: Math.min(leadingEntry.spanEnd, entry.spanEnd)
-            }
-
-            // split up the leadingEntry
-            this.splitEntry(leadingEntry, entry, hiddenEntries)
-          } else {
+
+        if (this.allowReslicing) {
+          const placeholderEntry = {
+            ...leadingEntry,
+            spanStart: Math.max(leadingEntry.spanStart, entry.spanStart),
+            spanEnd: Math.min(leadingEntry.spanEnd, entry.spanEnd)
+          }
+          const placeholderEntryId = buildEntryKey(placeholderEntry)
+
+          if (!forceHidden[placeholderEntryId]) {
+            forceHidden[placeholderEntryId] = true
+            entriesByLevel[level][lateral] = placeholderEntry
+            this.splitEntry(leadingEntry, entry, hiddenEntries) // split up the leadingEntry
+          }
+        } else {
+          const placeholderEntryId = buildEntryKey(leadingEntry)
+
+          if (!forceHidden[placeholderEntryId]) {
+            forceHidden[placeholderEntryId] = true
             hiddenEntries.push(leadingEntry)
           }
         }

packages/timegrid/src/TimeCol.tsx

@@ -201,7 +201,12 @@ export class TimeCol extends BaseComponent<TimeColProps> {
         spanStart + (eventMinHeight || 0), // yuck
         slatCoords.computeDateTop(seg.end, date),
       )
-      segInputs.push({ index: i, spanStart, spanEnd, thickness: 1 })
+      segInputs.push({
+        index: i,
+        spanStart: Math.round(spanStart), // for barely-overlapping collisions
+        spanEnd: Math.round(spanEnd), //
+        thickness: 1
+      })
     }
 
     return segInputs