DoorDash Enhanced

A comprehensive userscript that transforms the DoorDash experience with dark mode, ad blocking, fee transparency, checkout automation, and polished UI enhancements — all togglable from a built-in settings panel.

Installation

1. Install Tampermonkey or Violentmonkey in your browser
2. **Click here to install DoorDash Enhanced**
3. Confirm the installation when prompted

To access settings, press Alt+P or click the gear icon in the DoorDash header bar.

Features

Appearance

Ad Blocking

Transparency

Checkout

Utilities

UI Cleanup

How It Works

┌──────────────────┐     ┌──────────────────┐     ┌──────────────────┐
│   Tampermonkey    │────>│  DoorDash        │────>│  Settings Panel  │
│                  │     │  Enhanced IIFE   │     │                  │
│  Injects script  │     │                  │     │  Toggle features │
│  on page load    │     │  19 features     │     │  per-feature     │
└──────────────────┘     │  MutationObserver│     │  GM_setValue     │
                         │  SPA nav handler │     └──────────────────┘
                         └──────────────────┘
                                  │
                    ┌─────────────┼─────────────┐
                    │             │             │
              ┌─────▼─────┐ ┌────▼────┐ ┌──────▼──────┐
              │  CSS-Only  │ │ Observer│ │  Hybrid     │
              │  Features  │ │ Features│ │  Features   │
              │            │ │         │ │             │
              │ Dark Mode  │ │ Sponsor │ │ Tip Default │
              │ Wide Layout│ │ Blocking│ │ Fee Highlite│
              │ Flair CSS  │ │ Popups  │ │ Price Calc  │
              └────────────┘ └─────────┘ └─────────────┘

Key design decisions:

• Prism Design Tokens — Dark mode overrides DoorDash's own CSS custom properties (--usage-color-*, --comp-color-*) rather than brute-forcing colors, so it stays consistent with their design system
• SPA-Aware — Hooks into history.pushState / replaceState / popstate to re-apply features on DoorDash's client-side navigation
• MutationObserver — Each feature that needs DOM watching uses a shared safeObserver pattern with childList: true, subtree: true
• Text-Based Sponsored Detection — Uses TreeWalker to find literal "Sponsored" text nodes, then walks up the DOM to find card boundaries. No fragile class-hash selectors that break when DoorDash rebuilds
• GM_getValue / GM_setValue — All settings persist across sessions via the userscript manager's storage API

Configuration

All features are togglable from the built-in settings panel:

• Alt+P — Open the settings panel from any DoorDash page
• Gear icon — Click the gear icon injected into the DoorDash header bar
• Tampermonkey menu — Right-click the Tampermonkey icon → "Open Settings"

Settings are organized into groups: Appearance, Ad Blocking, Transparency, Checkout, Utilities, and UI Cleanup. Each feature can be independently enabled or disabled with instant apply/remove — no page reload required.

The Default Tip feature uses a dropdown selector:

• Off — No tip automation
• Remember Last — Stores the last tip you selected and auto-picks it next time
• Fixed Amount — Shows a $ [____] input where you set a specific dollar amount

Reset All Settings is available at the bottom of the panel to restore defaults.

Keyboard Shortcuts

FAQ / Troubleshooting

Q: The page disappears or looks broken after enabling the script. DoorDash uses React hydration which can conflict with early DOM manipulation. The script runs at document-idle and avoids modifying React-managed attributes to prevent hydration mismatches (React errors #418/#423). If you see issues, try disabling individual features to isolate the conflict.

Q: Sponsored listings still appear. The sponsored blocker runs on a 1.5-second interval to catch dynamically loaded content. If cards appear briefly before hiding, this is expected — the TreeWalker needs the DOM to render before it can find the "Sponsored" text nodes. Scrolling down to trigger lazy-loaded content will trigger a fresh sweep.

Q: Dark mode doesn't cover a specific element. DoorDash frequently ships new components. Open an issue with a screenshot and the element's CSS selector (right-click → Inspect), and it can be added to the Prism token overrides.

Q: The Default Tip isn't applying on checkout. The tip picker must be visible on the page for the script to interact with it. If DoorDash changes the tip UI structure, the "Other" custom input filling may need selector updates. The script uses React-compatible nativeInputValueSetter to set values.

Contributing

Issues, bug reports, and pull requests are welcome. When reporting a bug, please include:

• Browser and version
• Userscript manager and version
• Console errors (F12 → Console tab, filter for [DD Enhanced])
• Which feature(s) were enabled
• Screenshot if it's a visual issue

License

MIT — Do whatever you want with it.