remotion-dev/remotion · error

Could not locate the JSX element to move

Error message

Could not locate the JSX element to move

What it means

Thrown by getMoveSourceEdits (folder-source-edits.ts:379) when no located, directly-JSX-child item matches the element the codemod wants to move: for `move-composition-to-folder`, no direct JSX child has the given composition id; for `move-composition-or-folder`, no direct child matches the source composition/folder descriptor.

Solutions

1. Ensure the <Composition> or <Folder> is written as a direct JSX child inside the returned <Root> tree
2. Verify the composition id matches the id in the file (check for renames)
3. Reload Studio so it re-parses the current file contents, then retry the move
4. Move the element manually by cut/paste in the editor

Example fix

// before
{comps.map((c) => <Composition key={c.id} id={c.id} ... />)}

// after (literal child the codemod can locate)
<Composition id="MyComp" component={MyComp} durationInFrames={90} fps={30} width={1920} height={1080} />

const items = getLocatedItemsFromSource(input);
const movable = items.find((i) => i.directJsxChild && getCompositionIdFromJSXElement(i.node) === idToMove);
if (!movable) throw new Error(`Composition ${idToMove} is not a direct JSX child; move it manually`);

try {
  editFolderInSource({codeMod, input});
} catch (e) {
  if (e instanceof Error && e.message === 'Could not locate the JSX element to move') {
    // fall back to manual cut/paste in the editor
  }
}

When it happens

Trigger: Moving a composition whose `<Composition id=...>` is not a direct child of a JSXElement/JSXFragment in the Root file, moving a folder whose name/parentName pair does not exist, or the id/parentName in the codemod being stale after the file was edited externally.

Common situations: The composition is rendered via a variable, map, or helper component instead of being a literal JSX child; out-of-date Studio state after manual edits to the Root file; typo'd or renamed composition id.

Understand the failure class

Background: Record Not Found Errors: "not found", RecordNotFound, and "was not found" — what they mean and how to fix them — this error's family across 28 libraries.

Related errors

• Could not locate the destination folder
• Cannot duplicate JSX element with no parent
• Cannot split a JSX sequence without a source location
• Cannot split audio from a JSX element with no parent
• Cannot split JSX sequence with no parent

AI-assisted analysis of remotion-dev/remotion@46a3a6bf13 (2026-09-18). Data as JSON: /api/errors/912a04e24406100d. Report an issue: GitHub.

Appendix: source

Thrown at packages/studio-codemods/src/folder-source-edits.ts:379

		{type: 'move-composition-or-folder' | 'move-composition-to-folder'}
	>;
	input: string;
	items: LocatedItem[];
}): SourceEdit[] => {
	const source =
		codeMod.type === 'move-composition-to-folder'
			? (items.find(
					(item) =>
						item.directJsxChild &&
						getCompositionIdFromJSXElement(item.node) === codeMod.idToMove,
				) ?? null)
			: (items.find(
					(item) =>
						item.directJsxChild &&
						matchesItem({item: codeMod.source, located: item}),
				) ?? null);
	if (source === null) {
		throw new Error('Could not locate the JSX element to move');
	}

	const insertion = getJsxElementSourceForInsertion({
		element: source.node,
		input,
	});
	let insertionEdit: SourceEdit;
	if (codeMod.type === 'move-composition-to-folder') {
		if (codeMod.folderName === null) {
			const root = getRegistrationRoot(source.path);
			insertionEdit = getInsertionRootSourceEdit({
				input,
				insertion,
				root: root as never,
				nullRoot: null,
				prettierConfigOverride: null,
				insertInside: root.type === 'JSXFragment',
			});

View on GitHub (pinned to 46a3a6bf13)