Skip to content

Published editor lacks mobile viewport metadata and scales a 980px layout onto phones #2

Open

Description

@AlexMikhalev

The published editor at https://terraphim.ai/editor/ lacks <meta name="viewport" content="width=device-width, initial-scale=1.0">. On a 390 × 844 phone viewport, Chromium and WebKit with mobile/touch emulation render a 980 CSS-pixel layout, scaling the editor and its controls down. The surrounding website has a device-width viewport and its responsive navigation passes.

Observed on 12 October 2026 after website PR terraphim/terraphim.ai#25 deployed as c17ff75c8589284dfad2c1b2feb22f6effedc3c5. This is an existing admitted editor asset issue, not a navigation CSS regression: all 132 deployed editor assets match the unchanged admitted manifest e972d1c779cca709ff1a1c8e0b0c543b855d82d7e6fa26fbf14414f84c6fb1d0 (editor source identity 4050ac9a35e1255ebc3f1d7cd50eb0dd97059730).

Reproduction:

  1. Open /editor/ in mobile emulation at 390 × 844 with touch enabled.
  2. Read document.querySelector('meta[name="viewport"]'): null.
  3. Read innerWidth: 980 in Playwright Chromium 153.0.8010.12 and WebKit 26.6. Expected: 390 CSS pixels, with controls sized for the device viewport.

The functional flow passed in both engines: type a brief, create and swap risk → concern, download the actual graph and Markdown, confirm the graph assigns both terms the same concept ID, restore the draft after reload, and reopen the downloaded Markdown. Functional success should not be labelled a responsive mobile layout pass. Firefox passed at a 390px viewport, but Playwright Firefox does not support is_mobile; no physical-phone or native Safari acceptance is claimed.

Proposed fix and acceptance:

  • Add the viewport declaration in the editor's source HTML and rebuild through the normal release/admission process. Preserve the admitted bundle identity rather than silently patching generated website assets.
  • Add a regression assertion that mobile innerWidth equals the requested device viewport, alongside existing saved-output checks.
  • Verify readability and reachability of editing, alternatives, graph/export dialogs, save/open controls and keyboard interactions at 320px and 390px, and recheck desktop widths.

Gitea issue lookup returned HTTP 401 with the configured gtr credential. This GitHub issue records the finding in the corresponding accessible editor repository; Gitea tracking can be mirrored once access is restored.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions