databrowser.html: Race condition when loading from CDN
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 70
- Forks
- 31
- Avg merge
- 4h 14m
- Merged PRs (30d)
- 5
Description
Summary
The official databrowser.html has a race condition that causes failures when mashlib is loaded from a CDN (e.g., unpkg.com) rather than served locally.
Problem
Current implementation in src/databrowser.html:
<script>document.addEventListener('DOMContentLoaded', function() {
panes.runDataBrowser()
})</script>
<script defer="defer" src="mashlib.min.js"></script>
The defer attribute is supposed to ensure scripts execute after parsing but before DOMContentLoaded. However, with slow CDN loading:
- HTML parsing completes
- Browser starts downloading mashlib from CDN
DOMContentLoadedmay fire before download completes (browser behavior varies)panesis undefined → error or unexpected behavior
Symptoms
When using CDN-hosted mashlib:
- First page load shows blank content or recursive UI nesting
- Hard refresh (Ctrl+Shift+R) works
- Consistent reproduction in fresh/incognito browser sessions
Proposed Fix
Use script.onload pattern for reliable CDN loading:
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>SolidOS Web App</title>
<link href="https://unpkg.com/mashlib@2.0.0/dist/mash.css" rel="stylesheet">
</head>
<body id="PageBody">
<header id="PageHeader"></header>
<div class="TabulatorOutline" id="DummyUUID" role="main">
<table id="outline"></table>
<div id="GlobalDashboard"></div>
</div>
<footer id="PageFooter"></footer>
<script>
(function() {
var s = document.createElement('script');
s.src = 'https://unpkg.com/mashlib@2.0.0/dist/mashlib.min.js';
s.onload = function() { panes.runDataBrowser(); };
s.onerror = function() {
document.body.innerHTML = '<p>Failed to load Mashlib</p>';
};
document.head.appendChild(s);
})();
</script>
</body>
</html>
This guarantees panes.runDataBrowser() only executes after mashlib.min.js is fully loaded and executed.
Why This Matters
- CDN usage is common - Many developers want to quickly test/prototype without bundling
- unpkg.com recommendation - The README suggests using unpkg for quick starts
- Standard pattern -
script.onloadis how Google Analytics, Facebook SDK, and other CDN-loaded libraries handle this
Options
- Update databrowser.html to use
script.onloadpattern (works for both local and CDN) - Provide separate CDN example in documentation
- Document the limitation that
deferassumes local/fast loading
Context
Discovered while implementing mashlib support in JavaScriptSolidServer. We implemented a fix there: https://github.com/JavaScriptSolidServer/JavaScriptSolidServer/issues/8
Happy to submit a PR if the maintainers prefer option 1.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with src/databrowser.html and inspect how panes.runDataBrowser is invoked relative to mashlib.min.js loading. Reproduce with a CDN-hosted mashlib in a fresh browser session, then verify the page initializes reliably after the library loads without breaking local loading.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 48/100