Skip to main content
VelinStyle v1.3.0
⌂ Home
  1. Docs
  2. Help
  3. Motion not running

Docs for VelinStyle 1.3.x · verified against 1.3.0

Motion does not run 1.3.0

Work from initialization through policy, reduced-motion, and the explicit kill switch. Deutsch

Run diagnostics

Problem

Attributes are present but nothing animates, or motion is intentionally suppressed.

First check

Run the general diagnostic from the project directory first.

npx @birdapi/velinstyle doctor

Deeper check

npx @birdapi/velinstyle motion doctor .
npx @birdapi/velinstyle motion analyze .
npx @birdapi/velinstyle motion scan .

Quick check

  • Run commands from the intended project directory.
  • Use only documented profiles and flags.
  • Check again after every change.

Motion initialization is missing

Cause: initMotion was never imported/called, so attributes have no runtime.

  1. Solution 1: Import initMotion from @birdapi/velinstyle/motion and call it once on the document scope.
  2. Solution 2: Confirm the motion package export resolves in the bundler.
  3. Solution 3: Re-run npx @birdapi/velinstyle motion doctor . after wiring init.
Verify again
npx @birdapi/velinstyle doctor
npx @birdapi/velinstyle check ./index.html --profile docs

Reduced motion is active

Cause: prefers-reduced-motion: reduce intentionally limits or disables motion.

  1. Solution 1: Check OS/browser reduced-motion settings before changing code.
  2. Solution 2: Provide a non-motion fallback UX instead of forcing animation.
  3. Solution 3: Document the expected behavior for a11y reviews.
Verify again
npx @birdapi/velinstyle doctor
npx @birdapi/velinstyle check ./index.html --profile docs

Motion policy blocks the animation

Cause: data-velin-motion-policy on a scope rejects the intended motion.

  1. Solution 1: Inspect data-velin-motion-policy on the nearest ancestor of the dead animation.
  2. Solution 2: Align the attribute with the motion you intend to allow.
  3. Solution 3: Re-check with motion analyze / motion scan on the project path.
Verify again
npx @birdapi/velinstyle doctor
npx @birdapi/velinstyle check ./index.html --profile docs

Motion was explicitly disabled

Cause: data-velin-motion="off" is an intentional kill switch.

  1. Solution 1: Search the DOM for data-velin-motion="off".
  2. Solution 2: Remove or change it only when motion is required for that scope.
  3. Solution 3: Verify again with doctor and a focused page check.
Verify again
npx @birdapi/velinstyle doctor
npx @birdapi/velinstyle check ./index.html --profile docs

Motion diagnostics find a setup issue

Cause: Motion-specific tooling reports setup problems before animation code is wrong.

  1. Solution 1: Run npx @birdapi/velinstyle motion doctor . and fix reported setup first.
  2. Solution 2: Use motion analyze . then motion scan . for deeper findings.
  3. Solution 3: Only then adjust presets/clips (e.g. create/setup flows).
Verify again
npx @birdapi/velinstyle doctor
npx @birdapi/velinstyle check ./index.html --profile docs

Production omitted motion assets

Cause: production can drop motion when --no-motion is set or motion is unused in scanned HTML.

  1. Solution 1: Rebuild without --no-motion if motion is required.
  2. Solution 2: Confirm motion markup is visible to the production scanner.
  3. Solution 3: Explain the build with production . --explain before changing other flags.
Verify again
npx @birdapi/velinstyle doctor
npx @birdapi/velinstyle check ./index.html --profile docs

Still broken?

Copy this template into a support request and add the outputs.

BirdAPI Forum · VelinStyle Support