openvibers/openvibe.shared Commits

Shared 4.1.7: shell.page() removes the browser's body margin, so the Frame meets the window's edges (#75)

OP OpenVibers committed 29 days ago · bdb059b611 · 4 files, +12 −4

**`shell.page()` removes the browser's body margin (openvibe-shared 4.1.7).**

**Found:** while reviewing every home page. On openvibe.events and openvibe.bot, the Frame's footer stopped 8 px short of the window's edges on every side. Neither page has a stylesheet of its own beyond the showcase's, so the body kept the browser's default margin.

**Change (`shell.js`):** the head's reserved style, which already holds the navbar's 52 px, now starts with `body{margin:0}`. Sites that set it themselves are unchanged.

**Test:** `shell.test.js` checks the reserved style with the reset.

4.1.6 was tagged but not yet rolled out. The pin round goes straight to 4.1.7 after the 4.1.5 round in flight.

Changes

ddiff --git a/CHANGELOG.md b/CHANGELOG.md
iindex 11a7457..72de9cb 100644
---- a/CHANGELOG.md
++++ b/CHANGELOG.md
@@@ -4,6 +4,12 @@ All notable changes to `openvibe-shared`. Versions follow [semver](https://semve
  breaking change to any exported module, browser global or served file name is a new major.
  A release is the git tag `vX.Y.Z`; consumers pin the tag's tarball (see README).
  
++## 4.1.7 — 2026-10-15
++
++- **`shell.page()` removes the browser's body margin.** A site with no stylesheet of its own (openvibe.events,
++  openvibe.bot) kept the default 8 px, so the Frame's footer stopped short of the window's edges. The head's reserved
++  style now starts with `body{margin:0}`; sites that set it themselves are unchanged.
++
  ## 4.1.6 — 2026-10-15
  
  - **Play and Inventory show their own "Recently shipped".** `shipped.js` knew no `play` or `inventory` id, so the
ddiff --git a/package.json b/package.json
iindex e6f565a..6c3443b 100644
---- a/package.json
++++ b/package.json
@@@ -1,6 +1,6 @@
  {
    "name": "openvibe-shared",
--  "version": "4.1.6",
++  "version": "4.1.7",
    "description": "Shared navbar, footer, themes, icons, legal pages, SEO, auth and analytics for every OpenVibe site",
    "main": "index.js",
    "bin": {
ddiff --git a/shell.js b/shell.js
iindex 98af5a8..e0f2532 100644
---- a/shell.js
++++ b/shell.js
@@@ -114,8 +114,10 @@ function manifestLinks(o) {
  }
  
  // The shared navbar's script is deferred and mounts into the page's #navbar-mount: the mount holds the bar's 52px from
--// the first paint so the page does not drop when it lands (layout shift), and without JavaScript it goes away.
--const NAVBAR_RESERVE = '<style>#navbar-mount{min-height:52px}</style><noscript><style>#navbar-mount{display:none}</style></noscript>';
++// the first paint so the page does not drop when it lands (layout shift), and without JavaScript it goes away. The body
++// has no browser margin, so the Frame's navbar and footer meet the window's edges on a page with no stylesheet of its own
++// (openvibe.events and openvibe.bot showed an 8px frame around the footer).
++const NAVBAR_RESERVE = '<style>body{margin:0}#navbar-mount{min-height:52px}</style><noscript><style>#navbar-mount{display:none}</style></noscript>';
  
  function page(o = {}) {
      const name = o.name || o.service || 'OpenVibe';
ddiff --git a/test/shell.test.js b/test/shell.test.js
iindex c4c9186..2b9a24e 100644
---- a/test/shell.test.js
++++ b/test/shell.test.js
@@@ -27,7 +27,7 @@ assert.match(html, /<footer id="ov-footer"/, 'shared footer present');
  assert.ok(html.includes('<main id="hero">Hello</main>'), 'body kept verbatim');
  assert.ok(html.includes('<script src="/shared/theme-loader.js?v='), 'theme-loader via serve.url');
  // The deferred navbar lands in a #navbar-mount that already holds its height; without JavaScript the mount goes away.
--assert.ok(html.includes('<style>#navbar-mount{min-height:52px}</style><noscript><style>#navbar-mount{display:none}</style></noscript>'), 'navbar mount reserved');
++assert.ok(html.includes('<style>body{margin:0}#navbar-mount{min-height:52px}</style><noscript><style>#navbar-mount{display:none}</style></noscript>'), 'navbar mount reserved, and no browser margin around the body');
  assert.ok(html.indexOf('#navbar-mount{min-height:52px}') < html.indexOf('</head>'), 'in the head, before the first paint');
  
  // ── Script order: theme-loader first (eager); the runtime after it (deferred) ─────────────────────