Fruitful Docs
GuidesFocus

Test focus in the extension

See a focus policy applied on the live site before you publish.

Focus rules only prove themselves on the live page. Test them in the browser extension against the real site before a release.

Load the extension

The extension is apps/browser-extension in the repository. Build it and load it unpacked:

yarn workspace workspace.apps.browser-extension build

Then in Chrome: Extensions, Developer mode, Load unpacked, and pick the build output directory. Sign in to Fruitful in the extension so it knows which feeds you follow.

Follow the feed

A policy is active only while a feed on one of its routes is followed by an installed package. Against a local stack, install your package and follow the feed the way a user would; against a hermetic yarn dev:e2e stack, the scenario commands can seed the follow for you (see the repository's test/CLAUDE.md).

Visit the URLs

Open each URL pattern the policy names and check:

  • every hide rule removed exactly its target, and nothing the person needs;
  • the replace panel or interstitial appeared where the feed was, with the title you wrote;
  • navigation, search, and the person's own content still work;
  • reloading and client-side navigation (the site's own links) keep the policy applied.

Cosmetic rules are matched by the extension's engine, so a rule that works in the browser devtools console may still need the domain## prefix to match. Compare with the LinkedIn policy in feed-packages/linkedin for a working set.

Iterate

Focus changes do not touch the capture pipeline, so no fixtures or expectations change. Edit the manifest, run plugin validate to catch a malformed policy (unknown route id, missing URLs), rebuild, and reload the extension.

Reference: focusPolicy, Relationship rules.

On this page