Framework RecipesImplementation, failure path, check

Vue: preserve requirements through advanced agent edits

Work through JavaScript examples of real application boundaries: Cancel and invalidate Vue watcher requests before the next await; Dispose Vue realtime subscriptions when the owner disappears. Each recipe includes implementation code, integration prerequisites, failure-path tests to add, a Perch rule, and the captured broken/fixed source checks.

Download the Vue rule pack ZIP · Inspect the YAML rules

JavaScript

Cancel and invalidate Vue watcher requests before the next await

A tenant selection can change while an older query is still in flight. A watcher cleanup belongs to that invocation, so it can stop and invalidate exactly the work the next invocation supersedes. The onCleanup argument also works where onWatcherCleanup is unavailable.

Broken edit flagged · corrected edit passes

JavaScript

Dispose Vue realtime subscriptions when the owner disappears

A component can disappear while its socket and callback remain alive. That leaks resources and can continue collecting one tenant’s events after the user navigates elsewhere. Pair acquisition with scope disposal and invalidate callbacks that were already queued.

Broken edit flagged · corrected edit passes

Use a correction as a saved requirement

Choose the failure you need to prevent, add the scoped rule to your repository, and check both the broken and corrected implementation. Ask your agent to inspect the finding, repair the code and recheck the same rule. Keep framework tests beside the model check.

Perch keeps the requirement beside the code. Reuse the named check during the agent’s next edit and in CI, with cached answers free on unchanged requests.

Official Vue documentation · All language and framework recipes