{"record":{"id":"a027ea9a574e31ff","repo":"remotion-dev/remotion","slug":"the-playbackrate-props-must-be-a-real-number-bu","errorCode":null,"errorMessage":"The \"playbackRate\" props must be a real number, but is ${playbackRate}","messagePattern":"The \"playbackRate\" props must be a real number, but is (.+?)","errorType":"validation","errorClass":"TypeError","httpStatus":null,"severity":"error","filePath":"packages/lottie/src/validate-playbackrate.ts","lineNumber":21,"sourceCode":"\t\treturn;\n\t}\n\n\tif (typeof playbackRate !== 'number') {\n\t\tthrow new TypeError(\n\t\t\t`The \"playbackRate\" prop must be a number or undefined, but is ${JSON.stringify(\n\t\t\t\tplaybackRate,\n\t\t\t)}`,\n\t\t);\n\t}\n\n\tif (Number.isNaN(playbackRate) || !Number.isFinite(playbackRate)) {\n\t\tthrow new TypeError(\n\t\t\t`The \"playbackRate\" props must be a real number, but is ${playbackRate}`,\n\t\t);\n\t}\n\n\tif (playbackRate <= 0) {\n\t\tthrow new TypeError(\n\t\t\t`The \"playbackRate\" props must be positive, but is ${playbackRate}`,\n\t\t);\n\t}\n};\n","sourceCodeStart":3,"sourceCodeEnd":26,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/lottie/src/validate-playbackrate.ts#L3-L26","documentation":"Thrown by validatePlaybackRate in @remotion/lottie when `playbackRate` is a number but is NaN or Infinity/Infinity. These values break the frame-time arithmetic used to drive the Lottie animation, so they are rejected even though they are technically of type 'number'. A separate, later check rejects zero and negative values.","triggerScenarios":"Passing playbackRate={NaN} (e.g. Number(undefined), Number('abc'), 0/0), playbackRate={Infinity} (e.g. 1/0), or playbackRate={-Infinity}. Common when computing the rate from division by zero or from parseFloat on invalid input.","commonSituations":"Deriving playbackRate from a division whose denominator can be zero, from parseInt/parseFloat on user input that failed to parse, or from arithmetic on undefined values coerced to NaN.","solutions":["Sanitize the computed rate with a guard: const rate = Number.isFinite(raw) && raw > 0 ? raw : 1.","Fix the upstream calculation so it never produces NaN/Infinity (check denominators, validate parse results).","Default to a sensible rate when the computed value is not finite."],"exampleFix":"// before\n<Lottie src={anim} playbackRate={Number(queryRate)} /> // queryRate may be undefined\n\n// after\nconst rate = Number(queryRate);\n<Lottie src={anim} playbackRate={Number.isFinite(rate) && rate > 0 ? rate : undefined} />","handlingStrategy":"validation","validationCode":"const safeRate = (raw: unknown): number | undefined => {\n  const n = typeof raw === 'number' ? raw : Number(raw);\n  return Number.isFinite(n) && n > 0 ? n : undefined;\n};","typeGuard":"const isRealPositiveNumber = (v: unknown): v is number =>\n  typeof v === 'number' && Number.isFinite(v) && v > 0;","tryCatchPattern":null,"preventionTips":["Guard every computed rate with Number.isFinite before passing it down.","Audit divisions used to derive playbackRate for zero denominators.","Validate parseFloat/Number parse results before use."],"tags":["lottie","playback-rate","nan","validation","typeerror"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}