fix(KAN-71): correct Apple navigation gestures and scroll bounds

2026-09-29 07:22:45 +02:00
parent 0662a6970e
commit 4afaa79834
12 changed files with 784 additions and 44 deletions
@@ -0,0 +1,151 @@
+import assert from 'node:assert/strict';
+import { readFile } from 'node:fs/promises';
+import { createServer } from 'node:http';
+import process from 'node:process';
+
+const { chromium } = await import(
+    process.env.PLAYWRIGHT_MODULE ?? 'playwright'
+);
+const script = await readFile(
+    new URL('../ui/workspace-navigation.js', import.meta.url),
+    'utf8',
+);
+const server = createServer((request, response) => {
+    response.setHeader('Content-Type', 'text/html');
+    response.end(`<!doctype html><html><head><meta name="viewport" content="width=device-width,initial-scale=1"><style>
+        body { margin: 0; } #board { overflow-x: auto; width: 300px; height: 100px; }
+        #board > div { width: 1500px; height: 100px; } dialog { max-height: 200px; overflow-y: auto; }
+        </style></head><body><p id="page">${request.url}</p><input id="draft" value="retained"><div id="board"><div>Board columns</div></div>
+        <dialog><button id="close">Close</button><div style="height:1000px">Long dialog</div></dialog><div id="long"></div></body></html>`);
+});
+await new Promise((resolve) => server.listen(0, '127.0.0.1', resolve));
+const browser = await chromium.launch({ channel: 'chrome', headless: true });
+const page = await browser.newPage({ viewport: { width: 390, height: 844 } });
+await page.addInitScript(script);
+const root = `http://127.0.0.1:${server.address().port}`;
+try {
+    await page.goto(root);
+    const length = await page.evaluate(() => history.length);
+    for (const path of ['/board', '/ticket', '/settings']) {
+        await page.evaluate(
+            (path) =>
+                history.pushState(
+                    {
+                        page: { url: path },
+                        rememberedState: { draft: 'retained' },
+                    },
+                    '',
+                    path,
+                ),
+            path,
+        );
+    }
+    await page.evaluate(() => {
+        window.steps = 0;
+        addEventListener('popstate', () => window.steps++);
+    });
+    await page.evaluate(() => window.__kanbanNavigation.step(-1));
+    await page.waitForFunction(() => location.pathname === '/ticket');
+    assert.equal(await page.evaluate(() => window.steps), 1);
+    await page.evaluate(() => window.__kanbanNavigation.step(-1));
+    await page.waitForFunction(() => location.pathname === '/board');
+    await page.evaluate(() => window.__kanbanNavigation.step(1));
+    await page.waitForFunction(() => location.pathname === '/ticket');
+    assert.equal(await page.evaluate(() => window.steps), 3);
+    assert.equal(await page.evaluate(() => history.length), length + 3);
+    assert.equal(await page.locator('#draft').inputValue(), 'retained');
+    assert.equal(
+        await page.evaluate(() => history.state.rememberedState.draft),
+        'retained',
+    );
+    await page.goto(`${root}/full-page`);
+    await page.evaluate(() => window.__kanbanNavigation.step(-1));
+    await page.waitForURL(`${root}/ticket`);
+    await page.evaluate(() => window.__kanbanNavigation.step(1));
+    await page.waitForURL(`${root}/full-page`);
+    await page.locator('dialog').evaluate((dialog) => dialog.showModal());
+    assert.equal(
+        await page.evaluate(() => window.__kanbanNavigation.canSwipe(1, 1)),
+        false,
+    );
+    await page.locator('dialog').evaluate((dialog) => dialog.close());
+    for (const selector of ['#board', '#draft']) {
+        const point = await page.locator(selector).boundingBox();
+        assert.equal(
+            await page.evaluate(
+                ({ x, y }) => window.__kanbanNavigation.canSwipe(x + 5, y + 5),
+                point,
+            ),
+            false,
+        );
+    }
+    assert.equal(
+        await page.evaluate(() => window.__kanbanNavigation.canSwipe(1, 1)),
+        true,
+    );
+    await page.dispatchEvent('#board', 'dragstart');
+    assert.equal(
+        await page.evaluate(() => window.__kanbanNavigation.canSwipe(1, 1)),
+        false,
+    );
+    await page.dispatchEvent('#board', 'dragend');
+    assert.equal(
+        await page.evaluate(() => window.__kanbanNavigation.canSwipe(1, 1)),
+        true,
+    );
+    assert.equal(
+        await page.evaluate(
+            () =>
+                getComputedStyle(document.documentElement).overscrollBehaviorY,
+        ),
+        'none',
+    );
+    assert.equal(
+        await page.evaluate(
+            () =>
+                getComputedStyle(document.documentElement).overscrollBehaviorX,
+        ),
+        'auto',
+    );
+    assert.equal(
+        await page.evaluate(() => document.documentElement.scrollHeight),
+        844,
+    );
+    await page.mouse.move(380, 400);
+    await page.mouse.wheel(0, -1000);
+    await page.waitForTimeout(200);
+    assert.equal(await page.evaluate(() => scrollY), 0);
+    await page
+        .locator('#long')
+        .evaluate((element) => (element.style.height = '3000px'));
+    await page.mouse.wheel(0, 1000);
+    await page.waitForFunction(() => scrollY > 0);
+    await page.evaluate(() =>
+        scrollTo(0, document.documentElement.scrollHeight),
+    );
+    await page.mouse.wheel(0, 5000);
+    await page.waitForTimeout(200);
+    assert.equal(
+        await page.evaluate(() => scrollY + innerHeight),
+        await page.evaluate(() => document.documentElement.scrollHeight),
+    );
+    await page.evaluate(() => scrollTo(0, 0));
+    await page.locator('#board').hover();
+    await page.mouse.wheel(500, 0);
+    await page.waitForFunction(
+        () => document.querySelector('#board').scrollLeft > 0,
+    );
+    assert.equal(new URL(page.url()).pathname, '/full-page');
+    await page.locator('dialog').evaluate((dialog) => dialog.showModal());
+    await page.locator('dialog').hover();
+    await page.mouse.wheel(0, 500);
+    await page.waitForFunction(
+        () => document.querySelector('dialog').scrollTop > 0,
+    );
+    console.log(
+        'PASS: SPA/full-page history, forward history, overlays, short/long scroll bounds, horizontal board, drag and input guards',
+    );
+} finally {
+    await browser.close();
+    await new Promise((resolve) => server.close(resolve));
+}
@@ -0,0 +1,142 @@
+#import "../src-tauri/src/navigation.m"
+
+// Exercise the AppKit event adapter deterministically; macos_smoke separately
+// runs the shared history script against a real WKWebView.
+@interface TestWindow : NSWindow
+@end
+@implementation TestWindow
+- (BOOL)isKeyWindow { return YES; }
+@end
+
+@interface TestWebView : WKWebView
+@property(nonatomic, strong) NSWindow *testWindow;
+@property(nonatomic, strong) NSURL *testURL;
+@property(nonatomic) BOOL back;
+@property(nonatomic) BOOL forward;
+@property(nonatomic) BOOL allowsSwipe;
+@property(nonatomic) BOOL deferPermission;
+@property(nonatomic, copy) void (^permission)(id, NSError *);
+@property(nonatomic, strong) NSMutableArray<NSString *> *steps;
+@end
+@implementation TestWebView
+- (NSWindow *)window { return self.testWindow; }
+- (NSURL *)URL { return self.testURL; }
+- (BOOL)canGoBack { return self.back; }
+- (BOOL)canGoForward { return self.forward; }
+- (NSPoint)convertPoint:(NSPoint)point fromView:(NSView *)view { return point; }
+- (void)evaluateJavaScript:(NSString *)script completionHandler:(void (^)(id, NSError *))handler {
+    if ([script containsString:@".step("]) [self.steps addObject:script];
+    else if (self.deferPermission) self.permission = handler;
+    else handler(@(self.allowsSwipe), nil);
+}
+@end
+
+@interface TestEvent : NSEvent
+@property(nonatomic, strong) NSWindow *testWindow;
+@property(nonatomic) NSEventPhase testPhase;
+@property(nonatomic) NSEventPhase testMomentum;
+@property(nonatomic) CGFloat dx;
+@property(nonatomic) CGFloat dy;
+@property(nonatomic) BOOL precise;
+@property(nonatomic) NSInteger trackCount;
+@property(nonatomic, copy) void (^tracking)(CGFloat, NSEventPhase, BOOL, BOOL *);
+@end
+@implementation TestEvent
+- (NSWindow *)window { return self.testWindow; }
+- (NSEventPhase)phase { return self.testPhase; }
+- (NSEventPhase)momentumPhase { return self.testMomentum; }
+- (CGFloat)scrollingDeltaX { return self.dx; }
+- (CGFloat)scrollingDeltaY { return self.dy; }
+- (BOOL)hasPreciseScrollingDeltas { return self.precise; }
+- (NSPoint)locationInWindow { return NSMakePoint(20, 20); }
+- (void)trackSwipeEventWithOptions:(NSEventSwipeTrackingOptions)options dampenAmountThresholdMin:(CGFloat)minimum max:(CGFloat)maximum usingHandler:(void (^)(CGFloat, NSEventPhase, BOOL, BOOL *))handler {
+    NSCAssert(options & NSEventSwipeTrackingLockDirection, @"Direction must be locked");
+    self.trackCount++;
+    self.tracking = handler;
+}
+@end
+
+@interface TestNavigation : KanbanNavigation
+@property(nonatomic) BOOL enabled;
+@end
+@implementation TestNavigation
+- (BOOL)swipeTrackingEnabled { return self.enabled; }
+@end
+
+int main(void) {
+    @autoreleasepool {
+        [NSApplication sharedApplication];
+        TestWindow *window = [[TestWindow alloc] initWithContentRect:NSMakeRect(0, 0, 600, 400) styleMask:NSWindowStyleMaskBorderless backing:NSBackingStoreBuffered defer:NO];
+        TestWebView *webview = [[TestWebView alloc] initWithFrame:NSMakeRect(0, 0, 600, 400)];
+        webview.testWindow = window;
+        webview.testURL = [NSURL URLWithString:@"https://example.com/board"];
+        webview.back = YES;
+        webview.forward = YES;
+        webview.allowsSwipe = YES;
+        webview.steps = [NSMutableArray new];
+        TestNavigation *navigation = [TestNavigation new];
+        navigation.webview = webview;
+        navigation.enabled = YES;
+        TestEvent *(^event)(void) = ^{
+            TestEvent *value = [TestEvent new];
+            value.testWindow = window;
+            value.testPhase = NSEventPhaseBegan;
+            value.precise = YES;
+            value.dx = 15;
+            return value;
+        };
+        BOOL stop = NO;
+        TestEvent *back = event();
+        [navigation handleEvent:back];
+        NSCAssert(back.trackCount == 1, @"A horizontal gesture must use AppKit tracking");
+        back.tracking(0.5, NSEventPhaseChanged, NO, &stop);
+        NSCAssert(webview.steps.count == 0, @"A partial swipe must not navigate");
+        back.tracking(1, NSEventPhaseNone, YES, &stop);
+        NSCAssert(webview.steps.count == 1 && [webview.steps.lastObject containsString:@"step(-1)"], @"Back must request exactly one step");
+        TestEvent *forward = event();
+        forward.dx = -15;
+        [navigation handleEvent:forward];
+        forward.tracking(-1, NSEventPhaseNone, YES, &stop);
+        NSCAssert(webview.steps.count == 2 && [webview.steps.lastObject containsString:@"step(1)"], @"Forward must request exactly one step");
+        TestEvent *cancelled = event();
+        [navigation handleEvent:cancelled];
+        cancelled.tracking(0, NSEventPhaseCancelled, YES, &stop);
+        NSCAssert(webview.steps.count == 2, @"Cancelled swipes must not navigate");
+        TestEvent *interrupted = event();
+        [navigation handleEvent:interrupted];
+        webview.allowsSwipe = NO;
+        [navigation handleEvent:event()];
+        interrupted.tracking(1, NSEventPhaseNone, YES, &stop);
+        NSCAssert(webview.steps.count == 2, @"A new gesture must cancel the previous gesture's animation callback");
+
+        for (NSInteger test = 0; test < 7; test++) {
+            TestEvent *ignored = event();
+            navigation.enabled = test != 0;
+            webview.allowsSwipe = test != 1;
+            webview.back = webview.forward = test != 2;
+            if (test == 3) ignored.precise = NO;
+            if (test == 4) ignored.dy = 30;
+            if (test == 5) ignored.testMomentum = NSEventPhaseChanged;
+            if (test == 6) ignored.testWindow = nil;
+            NSCAssert([navigation handleEvent:ignored] == ignored && ignored.trackCount == 0, @"Non-navigation events must remain available for scrolling");
+        }
+        navigation.enabled = YES;
+        webview.allowsSwipe = YES;
+        webview.back = YES;
+        webview.deferPermission = YES;
+        TestEvent *stale = event();
+        [navigation handleEvent:stale];
+        TestEvent *ended = event();
+        ended.testPhase = NSEventPhaseEnded;
+        [navigation handleEvent:ended];
+        webview.permission(@YES, nil);
+        NSCAssert(stale.trackCount == 0, @"Late hit tests must not resurrect ended gestures");
+        TestEvent *changedPage = event();
+        [navigation handleEvent:changedPage];
+        webview.testURL = [NSURL URLWithString:@"https://example.com/settings"];
+        webview.permission(@YES, nil);
+        NSCAssert(changedPage.trackCount == 0, @"Page changes must invalidate a pending gesture");
+        puts("PASS: AppKit back/forward, cancelled/partial swipes, system preference, nested scroll ownership, empty history, mouse/vertical/momentum events, stale callbacks");
+    }
+    return 0;
+}
@@ -0,0 +1,58 @@
+import assert from 'node:assert/strict';
+import { spawnSync } from 'node:child_process';
+import { mkdtempSync, rmSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import process from 'node:process';
+import test from 'node:test';
+import { fileURLToPath } from 'node:url';
+
+test(
+    'AppKit gestures preserve single steps, cancellation, system preferences and scroll ownership',
+    { skip: process.platform !== 'darwin' },
+    () => {
+        const directory = mkdtempSync(join(tmpdir(), 'kanbangit-navigation-'));
+        const binary = join(directory, 'navigation-test');
+        try {
+            const compile = spawnSync(
+                'xcrun',
+                [
+                    '--sdk',
+                    'macosx',
+                    'clang',
+                    '-fobjc-arc',
+                    '-fblocks',
+                    '-Wall',
+                    '-Werror',
+                    '-framework',
+                    'AppKit',
+                    '-framework',
+                    'WebKit',
+                    fileURLToPath(
+                        new URL('./navigation-macos.m', import.meta.url),
+                    ),
+                    '-o',
+                    binary,
+                ],
+                { encoding: 'utf8', timeout: 30000 },
+            );
+            assert.equal(
+                compile.status,
+                0,
+                compile.stderr || compile.error?.message,
+            );
+            const result = spawnSync(binary, [], {
+                encoding: 'utf8',
+                timeout: 30000,
+            });
+            assert.equal(
+                result.status,
+                0,
+                result.stderr || result.error?.message,
+            );
+            assert.match(result.stdout, /PASS: AppKit/);
+        } finally {
+            rmSync(directory, { recursive: true, force: true });
+        }
+    },
+);