Prevent mobile trim release rollback
This commit is contained in:
@@ -51,6 +51,7 @@ export function createTimelineEdgeAutoScroller({ trackElement, pointerType, time
|
|||||||
(pointerType === "touch" && isMobile)
|
(pointerType === "touch" && isMobile)
|
||||||
|| (["mouse", "pen"].includes(pointerType) && !isMobile)
|
|| (["mouse", "pen"].includes(pointerType) && !isMobile)
|
||||||
);
|
);
|
||||||
|
const usesDesktopTrailingSpacer = enabled && !isMobile;
|
||||||
const rulerElement = enabled ? trackElement.closest?.(".timeline-board")?.querySelector?.(".timeline-ruler-canvas") : null;
|
const rulerElement = enabled ? trackElement.closest?.(".timeline-board")?.querySelector?.(".timeline-ruler-canvas") : null;
|
||||||
if (enabled) {
|
if (enabled) {
|
||||||
trackElement.classList?.add("is-trimming");
|
trackElement.classList?.add("is-trimming");
|
||||||
@@ -79,7 +80,7 @@ export function createTimelineEdgeAutoScroller({ trackElement, pointerType, time
|
|||||||
spacerElement.style.width = `${geometry.width}px`;
|
spacerElement.style.width = `${geometry.width}px`;
|
||||||
};
|
};
|
||||||
|
|
||||||
if (enabled && scrollElement?.ownerDocument?.createElement) {
|
if (usesDesktopTrailingSpacer && scrollElement?.ownerDocument?.createElement) {
|
||||||
const previousSpacer = scrollElement.querySelector?.("[data-timeline-trim-scroll-spacer]");
|
const previousSpacer = scrollElement.querySelector?.("[data-timeline-trim-scroll-spacer]");
|
||||||
previousSpacer?.__timelineTrimCleanup?.();
|
previousSpacer?.__timelineTrimCleanup?.();
|
||||||
previousSpacer?.remove?.();
|
previousSpacer?.remove?.();
|
||||||
|
|||||||
@@ -66,6 +66,29 @@ describe("mobile timeline edge auto-scroll", () => {
|
|||||||
expect(rulerClasses.has("is-trimming")).toBe(false);
|
expect(rulerClasses.has("is-trimming")).toBe(false);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("never creates or settles a desktop trailing spacer on mobile", () => {
|
||||||
|
let appended = 0;
|
||||||
|
const scrollElement = {
|
||||||
|
clientWidth: 400,
|
||||||
|
scrollLeft: 120,
|
||||||
|
ownerDocument: { createElement: () => ({}) },
|
||||||
|
appendChild: () => { appended += 1; },
|
||||||
|
};
|
||||||
|
const track = {
|
||||||
|
classList: { add() {}, remove() {} },
|
||||||
|
closest: () => null,
|
||||||
|
parentElement: scrollElement,
|
||||||
|
};
|
||||||
|
const scroller = createTimelineEdgeAutoScroller({
|
||||||
|
trackElement: track,
|
||||||
|
pointerType: "touch",
|
||||||
|
win: { matchMedia: () => ({ matches: true }), requestAnimationFrame: () => 1, cancelAnimationFrame() {} },
|
||||||
|
});
|
||||||
|
scroller.stop();
|
||||||
|
expect(appended).toBe(0);
|
||||||
|
expect(scrollElement.scrollLeft).toBe(120);
|
||||||
|
});
|
||||||
|
|
||||||
it("enables the same edge-scroll lifecycle for desktop mouse trimming", () => {
|
it("enables the same edge-scroll lifecycle for desktop mouse trimming", () => {
|
||||||
const values = new Set();
|
const values = new Set();
|
||||||
const track = {
|
const track = {
|
||||||
|
|||||||
Reference in New Issue
Block a user