mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-20 05:56:53 +00:00
Maurice
edea67ff7e
Dragging a place from the right pane to the left one did nothing on an iPad or a Samsung tablet — the row was selected as text instead. Phones never reach this layout, they get the mobile shell below md, so the coarse pointer check in dragDisabled was only ever switching tablets off. It was also doing that for a reason that had gone away. What swallowed the scroll gesture in #1432 was the drag-drop-touch polyfill, and that has been confined to hybrid laptops since. Width is the gate that still means something: below lg the plan and the places are separate tabs, so there is nothing to drag between. So touch is no longer a reason to disable the drag, and the planner arms the long-press bridge instead where the pointer is coarse. Rows get -webkit-touch-callout and user-select off there too, otherwise the press that starts the drag brings up the selection first. The isTouch prop had no other use and is gone, along with a comment claiming arrow reorder buttons take over on touch — there are none.
58 lines
1.8 KiB
TypeScript
58 lines
1.8 KiB
TypeScript
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
|
|
import { renderHook } from '@testing-library/react'
|
|
import { fireEvent } from '@testing-library/dom'
|
|
import { useTouchDragBridge } from './useTouchDragBridge'
|
|
|
|
describe('useTouchDragBridge (#1616)', () => {
|
|
let source: HTMLElement
|
|
let started: number
|
|
|
|
beforeEach(() => {
|
|
vi.useFakeTimers()
|
|
document.body.innerHTML = '<div data-touch-drag><div id="source" draggable="true">Place</div></div>'
|
|
source = document.getElementById('source')!
|
|
started = 0
|
|
document.addEventListener('dragstart', () => { started++ })
|
|
document.elementFromPoint = () => source
|
|
})
|
|
|
|
afterEach(() => {
|
|
vi.useRealTimers()
|
|
document.body.innerHTML = ''
|
|
})
|
|
|
|
/** Presses the row for longer than the bridge's long press. */
|
|
function longPress() {
|
|
fireEvent.touchStart(source, { touches: [{ identifier: 1, clientX: 10, clientY: 10 }] })
|
|
vi.advanceTimersByTime(400)
|
|
}
|
|
|
|
it('FE-TOUCHDRAGHOOK-001: while enabled a long press starts a drag', () => {
|
|
renderHook(() => useTouchDragBridge(true))
|
|
longPress()
|
|
expect(started).toBe(1)
|
|
})
|
|
|
|
it('FE-TOUCHDRAGHOOK-002: a mouse-driven desktop is left to the browser', () => {
|
|
renderHook(() => useTouchDragBridge(false))
|
|
longPress()
|
|
expect(started).toBe(0)
|
|
})
|
|
|
|
it('FE-TOUCHDRAGHOOK-003: leaving the planner stops the bridge watching', () => {
|
|
const { unmount } = renderHook(() => useTouchDragBridge(true))
|
|
unmount()
|
|
longPress()
|
|
expect(started).toBe(0)
|
|
})
|
|
|
|
it('FE-TOUCHDRAGHOOK-004: turning it off mid-session stops the bridge watching', () => {
|
|
const { rerender } = renderHook(({ on }) => useTouchDragBridge(on), {
|
|
initialProps: { on: true },
|
|
})
|
|
rerender({ on: false })
|
|
longPress()
|
|
expect(started).toBe(0)
|
|
})
|
|
})
|