Skip to content

fix(one-page): wrap a long picked note name instead of cutting it - #2135

Merged
chhoumann merged 1 commit into
masterfrom
fix/onepage-chip-long-name
Oct 2, 2026
Merged

chhoumann merged 1 commit into
masterfrom
fix/onepage-chip-long-name

Conversation

@chhoumann

@chhoumann chhoumann commented Oct 2, 2026 •

Copy link
Copy Markdown
Owner

Summary

The one-page form's file picker cut a long picked note name with an ellipsis (#2134), so on a phone you could not tell which note was picked. The chip label now wraps (overflow-wrap: anywhere), and text-align: start keeps a wrapped line at the chip's left edge (it inherited the setting control's end alignment, which right-aligned the second line).

Older than 2.30: 2.29.0 cuts a {{FILE:}} chip the same way. Since #2099 every one-page Capture to a folder, tag or property shows this chip, so 2.30 shows it much more often.

Before / after (iPhone, iOS 18.7, Obsidian 1.14.3, 440 px wide)

Before (2.30 candidate) After
before after

Testing

  • tests/e2e/one-page-capture-target.test.ts "shows the picked note's whole name on a phone" now picks a 93-character name in a 440 px modal and checks it is not cut, wraps onto more than one line, and starts every line at the same x. It fails on master (cut) and with overflow-wrap alone (right-aligned second line).
  • On the phone: chip 384 x 44, two lines both starting at x 37, remove button 22 px.
  • pnpm run test: 6607 passed, 33 skipped. pnpm run build-with-lint: clean.

Release impact

Visual only; a long name makes the chip taller. No settings or data change.

Fixes #2134

Note

Wrap long picked-note names in one-page quick-add chip instead of ellipsis

Replaces the ellipsis/single-line rules on .quickAddModal .qa-onepage-file-picker__chip-label in styles.css with overflow-wrap: anywhere word wrapping and start text alignment, so long picked-note names wrap across lines instead of being cut.

  • The phone e2e test in one-page-capture-target.test.ts now uses a long-name fixture and verifies the full name shows, wraps to multiple lines with a shared start position, stays inside the chip, and keeps the remove button at 22px.
  • The suggestion clipping assertion also flags labels whose right edge passes the picker container, beyond the existing scroll-width check.

Macroscope summarized 346fa72.

Summary by CodeRabbit

  • Bug Fixes
    • Long selected-note names in the file picker now wrap onto multiple lines instead of being truncated. The remove button remains accessible, and labels are checked against the picker’s boundaries.

The one-page file picker's chip cut a long note name with an ellipsis,
so on a phone you could not tell which note was picked. The name now
wraps, starting each line at the chip's left edge.

Fixes #2134
@chhoumann chhoumann linked an issue Oct 2, 2026 that may be closed by this pull request
@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Oct 2, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-10-02T08:07:20.131519Z 346fa72 PR opened
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@coderabbitai

coderabbitai Bot commented Oct 2, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 4e4c8ff0-c0df-43f1-b431-c2a08ff3fafe

📥 Commits

Reviewing files that changed from the base of the PR and between dd59057 and 346fa72.

📒 Files selected for processing (2)
  • src/styles.css
  • tests/e2e/one-page-capture-target.test.ts

Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 6 remain after this review.


📝 Walkthrough

Walkthrough

The file-picker chip label now wraps long names instead of truncating them with an ellipsis. The end-to-end tests check wrapping, label visibility, remove-button width, and clipping at the picker boundary.

Changes

File-picker chip labels

Layer / File(s) Summary
Wrap labels and verify picker boundaries
src/styles.css, tests/e2e/one-page-capture-target.test.ts
Long chip labels wrap. The phone test checks that the full name is visible across multiple lines and that the remove button remains 22px wide. Clipping checks also detect labels that extend beyond the picker’s right edge.

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~8 minutes

Change: Bug fix · Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to 346fa

Long selected names will wrap instead of being truncated, with no concrete regression identified that should prevent merging.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly and concisely describes the main change: wrapping long picked note names instead of truncating them.
Linked Issues check ✅ Passed Issue #2134 requires the one-page file-picker chip to show the full picked note name and wrap it when needed. src/styles.css removes the chip label's truncation behavior and adds `overflow-wrap: any…
Out of Scope Changes check ✅ Passed The changes stay within issue #2134. The CSS changes implement wrapping for the affected chip. The E2E changes add regression coverage and improve clipping checks for the picker UI. No unrelated produ…
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 1…
✨ Finishing Touches
📝 Generate docstrings
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR
  • Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Autopilot is currently an internal CodeRabbit preview.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

A rabbit taps a label wide,
Long names now have room to hide—
No, show each word from end to end,
While buttons keep their proper bend.
The picker wraps; I hop with cheer!

Comment @coderabbitai help to get the list of available commands.

@chhoumann
chhoumann merged commit 39661f0 into master Oct 2, 2026
15 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

One-page file picker cuts a long picked note name

1 participant