Skip to content

feat: add setAppearance for dark mode and forward custom CSS [ENG-3647] - #61

Open
Dhruwang wants to merge 4 commits into
mainfrom
feat/set-appearance-custom-css
Open

Dhruwang wants to merge 4 commits into
mainfrom
feat/set-appearance-custom-css

Conversation

@Dhruwang

@Dhruwang Dhruwang commented Oct 8, 2026 •

Copy link
Copy Markdown
Member

Ref ENG-3647

What & why

Was: Flutter surveys always rendered light, and the SDK dropped the workspace's compiled custom CSS.
Now: Formbricks.setAppearance(FormbricksAppearance.light | dark | system) switches surveys, live while open. Compiled workspace and survey CSS reach renderSurvey.

  • Works before setup (synchronous, not queued), or via the widget's appearance:. Survives logout, resets on app restart, never persisted or sent to the server. A string is accepted; unknown values log and fall back to light.
  • system follows the app's own theme (Theme/ThemeMode, else Cupertino), not the phone's, and updates live.
  • The survey page is built once; live changes use runJavaScript with ?., so older servers stay light. The WebViewHostBuilder signature is unchanged: the value reaches the default host through an InheritedNotifier.
  • customCss forwarded untouched, empty fields omitted, no key when there is none.

Where to look

Coverage

Behaviour Level Evidence
State, string/unknown values, listeners, system resolution (Material app dark on light phone, pinned light on dark phone, Cupertino), customCss omit/forward, html options unit (mutation) appearance_test.dart, survey_html_test.dart (new). Rerun: flutter test in packages/formbricks (366 pass)
Live light/dark/system switch keeps the typed answer, custom CSS applies, no-overlay mode manual recording and stills below
Overlay (backdrop) mode; Android manual Not run, see Open gaps
Screen recording and screenshots

Switching system appearance with the app theme while a survey is open

Full-quality recording (mp4)

Opened dark, custom CSS System, app theme dark System, app theme light
Survey opened in dark mode System appearance with the app in dark System appearance with the app in light

iOS simulator against a local server on the dark-mode and custom-CSS epic branch; workspace CSS gives pill buttons in light and amber in dark. The playground gained appearance and app-theme buttons.

Open gaps

  • Overlay (backdrop) presentation and Android not run; only the no-overlay path on iOS.
  • A change between the WebView mounting and the survey bundle loading is missed.
  • Needs a server whose renderer has setAppearance; older servers stay light.

Breaking changes

  • None. Purely additive API.

Migrations & env

None.


Agent: claude-sonnet-5-5 (Claude Code), effort unknown.

@Dhruwang
Dhruwang marked this pull request as ready for review October 8, 2026 07:06
@Dhruwang
Dhruwang requested a review from itsjavi October 8, 2026 07:06
@coderabbitai

coderabbitai Bot commented Oct 8, 2026 •

Copy link
Copy Markdown
Contributor

Important

  • 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: ASSERTIVE
  • Plan: Advanced
  • Run ID: bb8776ee-f481-4f59-b427-3c2977ed8091
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

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

Comment thread packages/formbricks/lib/src/widgets/default_webview_host.dart
itsjavi and others added 2 commits October 8, 2026 18:56
A setAppearance call before surveys.umd.cjs finished loading hit no renderer
but was still recorded as applied, so the change was lost and repeats deduped.
The page now reports onSurveyRendered; the host holds changes until then and
diffs against the value actually baked into the page.
@sonarqubecloud

sonarqubecloud Bot commented Oct 9, 2026

Copy link
Copy Markdown

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.

2 participants