#5305 Fix ReferenceError: toTitleCase undefined in planet UI

[Mokshii46]

Fix: Resolve toTitleCase undefined error in GlobalTag.js

Summary

Fixes Uncaught ReferenceError: toTitleCase is not defined error that prevented the Planet view from loading properly by ensuring utils.js is in the correct location and loaded before dependent modules.

Problem

The Music Blocks Planet view was failing to load with the following error:

1. GlobalTag.js calls toTitleCase() function during tag rendering
2. utils.js (which defines toTitleCase) was not in the correct directory
3. The server returned a 404 HTML page instead of the JavaScript file
4. Browser refused to execute due to MIME type mismatch (text/html instead of application/javascript)
5. This caused all Planet tags to fail rendering, breaking the entire Planet interface

Solution

Changes Made

1. Moved utils.js to the correct directory (js/utils.js) to match the import path in index.html
2. Verified proper script loading order (utils.js loads before GlobalTag.js)

Technical Details

• The index.html file expects utils.js at js/utils.js
• The file was previously located at an incorrect path
• Moving the file ensures the browser can load it with the correct MIME type
• The toTitleCase() function is now globally accessible when GlobalTag.js executes

Before:

After:

Testing

• Verified utils.js loads successfully in Network tab (returns 200 OK)
• Confirmed MIME type is application/javascript
• No toTitleCase is not defined errors in console
• GlobalTag renders correctly with proper title casing
• Planet view displays all tags without errors
• Tag selection and filtering work as expected
• Tested on Chrome/Firefox (latest stable)

Related Issues

Fixes #5305

Checklist

• Changes follow Sugar Labs coding standards
• No functional changes to existing code
• Tested locally with hard refresh (Ctrl+Shift+R)
• Verified no console errors during page load
• All Planet view features working correctly

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

synthutils.test.js
PitchActions.test.js
utils.test.js
rubrics.test.js

[Mokshii46]

Hi!
The latest GitHub Actions run is green and all Jest tests are passing now.
This PR is ready for review.
Thanks!

[Mokshii46]

Hey @walterbender @omsuneri ,I have opened a PR ,please check when you get time.
Thank you!

[omsuneri]

@Mokshii46 please resolve the conflicts !!

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

synthutils.test.js
PitchActions.test.js
abc.test.js
utils.test.js
rubrics.test.js

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

abc.test.js

[Mokshii46]

@omsuneri Changes done.Please review it again.

[walterbender]

Why do we need to define the function twice? Why cannot we use the version in js/utils/utils.js from the planet code?

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

abc.test.js

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

synthutils.test.js
PitchActions.test.js
abc.test.js
utils.test.js

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

abc.test.js

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

abc.test.js

[Mokshii46]

You are right!!
I’ve updated js/utils/utils.js so toTitleCase is shared between Planet and core utils without duplicating code or overwriting existing exports.
All tests are passing now.
@walterbender @omsuneri