fix(google-maps): prevent blank space during page transitions

[harlan-zw]

🔗 Linked issue

Resolves #714

❓ Type of change

• 📖 Documentation
• 🐞 Bug fix
• 👌 Enhancement
• ✨ New feature
• 🧹 Chore
• ⚠️ Breaking change

📚 Description

ScriptGoogleMaps removed its map DOM (mapEl.value?.firstChild?.remove()) inside onBeforeUnmount, which fired while the page-transition leave animation was still playing and left a blank area where the map used to be. Vue already removes the parent element on actual unmount, so dropping the manual DOM removal lets the map stay visible through the transition.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
scripts-playground	Ready	Preview, Comment	Apr 15, 2026 5:43pm

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@nuxt/scripts@715

commit: e108c93

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 6a1adc24-68e7-4ad2-a2c2-06e67772079c

📥 Commits

Reviewing files that changed from the base of the PR and between e8ddd1d and e108c93.

📒 Files selected for processing (1)

• packages/script/src/runtime/components/GoogleMaps/ScriptGoogleMaps.vue

---

📝 Walkthrough

Walkthrough

The change modifies the onBeforeUnmount lifecycle hook in ScriptGoogleMaps.vue by removing the explicit DOM element removal call (mapEl.value?.firstChild?.remove()). The cleanup still unbinds all map listeners via map.value?.unbindAll(), clears the map reference, and clears internal caches. By deferring DOM teardown to Vue's natural unmount process of the parent element, the map's DOM structure is preserved longer during component lifecycle transitions.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly describes the main change: preventing blank space during page transitions in the Google Maps component, which is the primary objective of the PR.
Description check	✅ Passed	The description is directly related to the changeset, explaining why the manual DOM removal was removed and how Vue's unmount handling resolves the transition issue.
Linked Issues check	✅ Passed	The PR addresses the requirement from issue #714 by removing premature DOM removal during transitions, allowing the map to remain visible through page-transition leave animations.
Out of Scope Changes check	✅ Passed	The changes in ScriptGoogleMaps.vue are narrowly scoped to the onBeforeUnmount cleanup logic and directly address the transition blank-space issue without introducing unrelated modifications.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/google-maps-blank-space-page-transitions

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}