krahets/hello-algo · error · Error
Starfield: No origin element found.
Error message
Starfield: No origin element found.
What it means
Thrown by setup() in the starfield module only when `config.auto` is truthy. In auto mode an origin element is required (the point stars emanate from); it is taken from `config.originElement` or `document.querySelector('.starfield-origin')`. If neither resolves, setup aborts before binding mouse handlers.
Source
Thrown at overrides/javascripts/starfield.js:117
canvas.height = height;
canvas.style.position = "absolute";
canvas.style.top = "0";
canvas.style.left = "0";
canvas.style.width = "100%";
canvas.style.height = "100%";
canvas.style.zIndex = "-1";
canvasRGB = parseRGBA(config.canvasColor);
container.appendChild(canvas);
ctx = canvas.getContext("2d");
if (config.auto) {
origin =
config.originElement || document.querySelector(".starfield-origin");
if (!origin) {
throw new Error("Starfield: No origin element found.");
}
originX = getOriginX(origin, container);
originY = getOriginY(origin, container);
origin.addEventListener("mouseenter", mouseEnterHandler);
origin.addEventListener("mouseleave", mouseLeaveHandler);
window.addEventListener("resize", resizeHandler);
} else {
originX = config.originX !== null ? config.originX : width / 2;
originY = config.originY !== null ? config.originY : height / 2;
}
for (let i = 0; i < config.numStars; i++) {
const star = createRandomStar();
stars.push(star);
}
View on GitHub (pinned to 69932aed18)
Solutions
- Add an element with class `starfield-origin` where you want stars to emanate, or pass `{ originElement: myEl }`.
- If you do not need mouse-interactive origin, call setup without `auto: true` (it falls back to originX/originY or canvas center).
- Confirm the origin element is present at setup time (DOMContentLoaded / after SPA render).
- Double-check the `.starfield-origin` class spelling in the template.
Example fix
// before
starfield.setup({ auto: true });
// after
const origin = document.querySelector('.starfield-origin');
if (origin) starfield.setup({ auto: true, originElement: origin });
else starfield.setup({ auto: false }); // or supply originX/originY Defensive patterns
Strategy: validation
Validate before calling
// In auto mode, ensure an origin element exists before setup.
const origin = document.querySelector('.starfield-origin');
if (origin) {
starfield.setup({ auto: true, originElement: origin });
} else {
starfield.setup({ auto: false }); // or pass originX/originY
} Type guard
function starfieldOriginReady(config) {
if (!config || !config.auto) return true;
const el = config.originElement || document.querySelector('.starfield-origin');
return el instanceof HTMLElement;
} Try / catch
try {
starfield.setup(userConfig);
} catch (e) {
if (e instanceof Error && /No origin element found/.test(e.message)) {
// fall back to non-auto mode
starfield.setup({ ...userConfig, auto: false });
} else throw e;
} Prevention
- Only enable `auto: true` on pages that render `.starfield-origin`.
- Pass `originElement` explicitly to avoid relying on the global selector.
- If the hero/origin section is conditional, gate `auto` on its presence.
- In SPAs, re-check the origin element on each route change.
When it happens
Trigger: Calling setup({ auto: true }) on a page lacking any `.starfield-origin` element and without `originElement` in config; auto mode enabled in theme config but the corresponding origin markup is conditional and absent; origin element removed by an SPA route change before setup; selector typo.
Common situations: MkDocs/Material override where the origin element is only rendered on certain pages (e.g. the home/hero section); enabling `auto` globally but some pages omit the hero; deferred script racing the DOM; CSS class renamed without updating the JS config.
Related errors
- Starfield: No container element found.
- 索引越界
- Illegal Argument Exception
- Index Out Of Bounds Exception
- 堆为空
AI-assisted analysis of krahets/hello-algo@69932aed18 (2026-08-13).
Data as JSON: /api/errors/672499ce7b47c94c.
Report an issue: GitHub.