Skip to content

Onboarding: Updated copy and styling for Chrome extension installation option - #2906

Merged
rachelmcr merged 4 commits into
mainfrom
rachel/chrome-extension-install-updates
Jul 27, 2026
Merged

Onboarding: Updated copy and styling for Chrome extension installation option#2906
rachelmcr merged 4 commits into
mainfrom
rachel/chrome-extension-install-updates

Conversation

@rachelmcr

@rachelmcr rachelmcr commented Jul 24, 2026

Copy link
Copy Markdown
Contributor

Asana Task/Github Issue: https://app.asana.com/1/137249556945/task/1216850214485079?focus=true

Description

Changes based on ship review feedback to the onboarding getStarted step updated in #2810:

  • Copy change (title case)
  • Tooltip styling changes

Testing Steps

  1. cd special-pages
  2. npm run serve
  3. Open http://localhost:3210/onboarding/?page=getStarted&chromeExtension=true&order=v4
  4. The button uses title case: "Start Browser Setup"
  5. Hovering over the info icon next to "Also install our Chrome search extension" checkbox shows a tooltip with a new background color and larger text.

Checklist

Please tick all that apply:

  • I have tested this change locally
  • I have tested this change locally in all supported browsers
  • This change will be visible to users
  • I have added automated tests that cover this change
  • I have ensured the change is gated by config
  • This change was covered by a ship review
  • This change was covered by a tech design
  • Any dependent config has been merged

Note

Low Risk
Copy, CSS, and locale-only changes with test selector updates; no logic or security changes.

Overview
Ship-review follow-up for the v4 getStarted step: Start Browser Setup is now title case in English, and integration tests click that label.

The Chrome extension info tooltip in GetStartedContent.module.css is wider, uses surface-tertiary, and uses larger, regular-weight text (12px / 15px line height).

Locale files add or refresh v4 get-started copy (including AI-focused getStarted_title_v4 and setup button strings) and add getStarted_chromeExtension_label / getStarted_chromeExtension_tooltip across non-English bundles.

Reviewed by Cursor Bugbot for commit 7d65797. Bugbot is set up for automated code reviews on this repo. Configure here.

daxtheduck
daxtheduck previously approved these changes Jul 24, 2026

@cursor cursor Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Stale comment

Injected PR Evaluation: Web Compatibility & Security

PR: Rachel/chrome extension install updates (b3475f4b)
Scope: 3 files, all special-pages/pages/onboarding/ — CSS tooltip styling, English locale string, integration test selectors. No injected/, messaging/, or runtime injection changes.


Web Compatibility Assessment

No findings.

This PR does not touch content-scope injection, browser API overrides, wrapper utilities, or third-party page execution paths. Changes are confined to the first-party onboarding special page (embedded UI).

Infospecial-pages/pages/onboarding/public/locales/en/onboarding.json (~L473): Button label updated to title case ("Start Browser Setup"). Other locale files are unchanged; they will retain the previous casing until the updated en string is uploaded to Smartling. This is expected workflow, not a runtime regression.

Infospecial-pages/pages/onboarding/app/v4/components/GetStartedContent.module.css (~L147–166): Tooltip width (182→228px), typography (10/500/14 → 12/400/15), and background (--ds-surface-primary--ds-surface-tertiary) are cosmetic. The tertiary surface token is already used by the adjacent checkbox (L92), so this improves visual consistency. pointer-events: none is preserved; no viewport or layout-shift risk.

Infospecial-pages/pages/onboarding/integration-tests/onboarding.v4.spec.js: Test selectors updated to match the new button label. No behavioral test changes.


Security Assessment

No findings.

  • No changes to captured-globals.js, messaging transports, message bridge, or nativeData handling.
  • No new postMessage, fetch, dynamic code execution, or DOM injection of page-derived values.
  • Chrome extension install flow (requestChromeExtensionInstall) is pre-existing and unchanged in this PR.

Risk Level

Low Risk — Special-pages onboarding copy and tooltip CSS only; zero changes to injected runtime, API shims, or messaging security boundaries.


Recommendations

  1. Info: After merging, include the updated getStartedButton_v4 string in the next Smartling upload so non-English locales get the title-case label.
  2. Info (optional): If screenshot tests cover the Chrome extension tooltip, consider updating baselines; otherwise manual visual check on the getStarted step with chrome-extension-install enabled is sufficient.
Open in Web View Automation 

Sent by Cursor Automation: Web compat and sec

@github-actions github-actions Bot added the semver-patch Bug fix / internal — no release needed label Jul 24, 2026
@github-actions

github-actions Bot commented Jul 24, 2026

Copy link
Copy Markdown
Contributor

[Beta] Generated file diff

Time updated: Mon, 27 Jul 2026 12:54:49 GMT

Apple
    - apple/pages/onboarding/dist/index.css
  • apple/pages/onboarding/dist/index.js
  • apple/pages/onboarding/locales/de/onboarding.json
  • apple/pages/onboarding/locales/en/onboarding.json
  • apple/pages/onboarding/locales/es/onboarding.json
  • apple/pages/onboarding/locales/fr/onboarding.json
  • apple/pages/onboarding/locales/it/onboarding.json
  • apple/pages/onboarding/locales/nl/onboarding.json
  • apple/pages/onboarding/locales/pl/onboarding.json
  • apple/pages/onboarding/locales/pt/onboarding.json
  • apple/pages/onboarding/locales/ru/onboarding.json

File has changed

Integration
    - integration/pages/onboarding/dist/index.css
  • integration/pages/onboarding/dist/index.js
  • integration/pages/onboarding/locales/de/onboarding.json
  • integration/pages/onboarding/locales/en/onboarding.json
  • integration/pages/onboarding/locales/es/onboarding.json
  • integration/pages/onboarding/locales/fr/onboarding.json
  • integration/pages/onboarding/locales/it/onboarding.json
  • integration/pages/onboarding/locales/nl/onboarding.json
  • integration/pages/onboarding/locales/pl/onboarding.json
  • integration/pages/onboarding/locales/pt/onboarding.json
  • integration/pages/onboarding/locales/ru/onboarding.json

File has changed

Windows
    - windows/pages/onboarding/dist/index.css
  • windows/pages/onboarding/dist/index.js
  • windows/pages/onboarding/locales/de/onboarding.json
  • windows/pages/onboarding/locales/en/onboarding.json
  • windows/pages/onboarding/locales/es/onboarding.json
  • windows/pages/onboarding/locales/fr/onboarding.json
  • windows/pages/onboarding/locales/it/onboarding.json
  • windows/pages/onboarding/locales/nl/onboarding.json
  • windows/pages/onboarding/locales/pl/onboarding.json
  • windows/pages/onboarding/locales/pt/onboarding.json
  • windows/pages/onboarding/locales/ru/onboarding.json

File has changed

@rachelmcr rachelmcr changed the title Rachel/chrome extension install updates Ship review updates to Chrome extension installation option in onboarding Jul 24, 2026
@rachelmcr rachelmcr changed the title Ship review updates to Chrome extension installation option in onboarding Onboarding: Updated copy and styling for Chrome extension installation option Jul 24, 2026
@daxtheduck
daxtheduck dismissed their stale review July 27, 2026 10:19

Dismissing stale approval — new commits pushed, awaiting Cursor re-review.

daxtheduck
daxtheduck previously approved these changes Jul 27, 2026

@mgurgel mgurgel left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM. Can confirm tooltip is much easier to read now

Image Image

…rings

Add getStarted_chromeExtension_label and getStarted_chromeExtension_tooltip
for all locales (de, es, fr, it, nl, pl, pt, ru). These shipped English-only
in #2810, so non-English users saw the English checkbox label and tooltip via
the TranslationProvider fallback.

Also refresh getStarted_title_v4 and getStartedButton_v4, whose translations
still reflected the pre-#2810 English copy: the clause about deciding when and
how to use AI was absent from the title, and the button read a translation of
"Let's do it!" instead of "Start browser setup".
@daxtheduck
daxtheduck dismissed their stale review July 27, 2026 12:53

Dismissing stale approval — new commits pushed, awaiting Cursor re-review.

@github-actions

Copy link
Copy Markdown
Contributor

Build Branch

Branch pr-releases/rachel/chrome-extension-install-updates
Commit 7e3207e2bf
Updated July 27, 2026 at 12:54:11 PM UTC

Static preview entry points

QR codes (mobile preview)
Entry point QR code
Docs QR for docs preview
Static pages QR for static pages preview
Integration pages QR for integration pages preview

Integration commands

npm (Android / Extension):

npm i github:duckduckgo/content-scope-scripts#pr-releases/rachel/chrome-extension-install-updates

Swift Package Manager (Apple):

.package(url: "https://github.com/duckduckgo/content-scope-scripts.git", branch: "pr-releases/rachel/chrome-extension-install-updates")

git submodule (Windows):

git -C submodules/content-scope-scripts fetch origin pr-releases/rachel/chrome-extension-install-updates
git -C submodules/content-scope-scripts checkout origin/pr-releases/rachel/chrome-extension-install-updates
Pin to exact commit

npm (Android / Extension):

npm i github:duckduckgo/content-scope-scripts#7e3207e2bf9127c95a615135877f5551fd469760

Swift Package Manager (Apple):

.package(url: "https://github.com/duckduckgo/content-scope-scripts.git", revision: "7e3207e2bf9127c95a615135877f5551fd469760")

git submodule (Windows):

git -C submodules/content-scope-scripts fetch origin pr-releases/rachel/chrome-extension-install-updates
git -C submodules/content-scope-scripts checkout 7e3207e2bf9127c95a615135877f5551fd469760

@cursor cursor Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Injected PR Evaluation: Web Compatibility & Security

Scope: 15 files, all under special-pages/pages/onboarding/ — CSS tooltip styling, locale copy, integration-test selectors, and screenshot baselines. No injected/ changes.

Web Compatibility Assessment

File Lines Severity Finding
(entire PR) info Changes are confined to the embedded onboarding special page. No browser API overrides, prototype patches, or third-party page interaction — zero web-compat surface for injected protections.
GetStartedContent.module.css 150–164 info Tooltip width increased (182→228 px) and typography adjusted to fit longer copy. white-space: normal + overflow-wrap: break-word are already present — good for i18n string length variance.
public/locales/*/onboarding.json various info Non-EN locales gain getStarted_chromeExtension_* keys and updated getStarted_title_v4 / getStartedButton_v4 copy. Longer title strings may affect bubble layout on small viewports; screenshot baselines were rebaselined accordingly.
integration-tests/onboarding.v4.spec.js 13, 341, 394, 987, 1015 info Selector updated to match EN button casing (Start Browser Setup). Test-only; no runtime impact.

No warnings or errors identified.

Security Assessment

File Lines Severity Finding
(entire PR) info No changes to messaging schemas, transports, captured-globals, message-bridge trust boundaries, or native notify/request call sites.
GetStartedContent.js (unchanged) 128–131 info Tooltip text is rendered as JSX text content ({tooltip}), not dangerouslySetInnerHTML — translation strings cannot inject HTML/CSS. (Pre-existing; not modified in this diff.)
public/locales/*/onboarding.json various info Static Smartling-managed strings only; no page-derived or config-derived content in outgoing messages.

No warnings, errors, or critical findings.

Risk Level

Low Risk — Copy, CSS, locale, and test-only changes within the onboarding special page; no injected runtime, API shimming, or messaging security surface touched.

Recommendations

  1. None required for injected web-compat or security.
  2. (Optional, info) Confirm non-EN getStarted_title_v4 strings render acceptably without {newline} on narrow macOS/Windows bubble widths — screenshots cover EN getStarted but not every locale.
  3. (Pre-existing, out of scope) requestChromeExtensionInstall notify path in GetStartedContent.js / global.js is user-opt-in gated by checkbox; no changes needed in this PR.
Open in Web View Automation 

Sent by Cursor Automation: Web compat and sec

@rachelmcr
rachelmcr added this pull request to the merge queue Jul 27, 2026
Merged via the queue into main with commit 701cb7b Jul 27, 2026
46 checks passed
@rachelmcr
rachelmcr deleted the rachel/chrome-extension-install-updates branch July 27, 2026 13:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

semver-patch Bug fix / internal — no release needed

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants