Javascript files loading in preview, not in published site

Bootstrap Studio Help
1

This is the weirdest thing, my JS is loading in the previewed site, but the published version isn’t loading any of my javascript files. They’re all set to completely visible, so I’m not sure what’s going on.

2

Any console errors upon loading the site? Can you share a link to the page to help check for bugs? :slight_smile:

4

I’ll be back at my computer soon and will check this, if someone else doesn’t before me.

I must say, brilliant website!

What are some of the missing JS files called?

5

Thanks for your feedback! I’ve found the source of the error, bootstrap studio is combining and minifying the files into one large JS file for the published site, but not the previewed site. There must be an issue with one of my JS files that’s causing the rest not to load properly.

6

That’s great to hear!

You might want to check each file for the correct closing brackets, single JS files are usually happy if they have don’t have their logic closed correctly, but once minified there can be issues.

7

In your HTML, a scroll-to-top button is missing.

In your main.js, the following eventListener lacks a guard:

scrollTop.addEventListener('click', (e) => {
	e.preventDefault();
	window.scrollTo({
		top: 0,
		behavior: 'smooth'
	});
});

Adding a guard, as shown below, resolves the error:

scrollTop?.addEventListener('click', (e) => {
	e.preventDefault();
	window.scrollTo({
		top: 0,
		behavior: 'smooth'
	});
});
8

I just came to that conclusion myself and wanted to come back here and let everybody know it was resolved. It would have saved me a lot of time if I had checked here! Thank you.

9

Beautiful website. A couple of minor things I noticed on my old Windows 7 desktop…

For some reason, the Lessons for Kids page is not fully loading in Firefox 115.26.0 (which is an extended support release of Firefox for older O.S.'s like Windows 7). The carousel does not work, and everything below the carousel and above footer is not being rendered (possibly a script issue?) Oddly, the Teen and Adult pages, which seem very similar, load fine.

In Chrome 109.0.5414.120 (the last version of Chrome released for Windows 7), these…

background: linear-gradient(135deg,var(--bs-info),color-mix(in srgb,var(--accent-color),purple 60%));

background-color: color-mix(in srgb,var(--background-color),transparent 30%);

do not render because color-mix is not supported (may not matter if you don’t care about backward compatibility with older browsers/O.S.'s, but if you do, you may want to add fallbacks.)

10

One other minor issue I spotted, which is relevant on modern mobile browsers… the tab content container which has the fixed text that reads, “Use the arrows to learn more about our Performance Pathway”… the text on each tap is running into this fixed text. See highlight on screenshot below…

image
image359×610 33.9 KB

11

Thanks for your kind words and for pointing out on both of these issues, I appreciate it!