vfsjs-test 1.0.28 → 1.0.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/index.html +7 -6
  2. package/main.js +73 -66
  3. package/package.json +1 -1
  4. package/sw.js +31 -50
  5. package/vfsjs.js +22 -47
package/index.html CHANGED
@@ -2,18 +2,19 @@
2
2
  <html lang="en">
3
3
  <head>
4
4
  <script src="vfsjs.js"></script>
5
-
6
5
  <script src="main.js"></script>
7
6
 
8
7
  <meta charset="UTF-8">
9
- <title>My Completely Normal Project</title>
8
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
9
+ <title>VFS Production App</title>
10
10
 
11
11
  <link rel="stylesheet" href="style.css?vfs=true">
12
+ <script src="app.js?vfs=true"></script>
12
13
  </head>
13
14
  <body>
14
- <h1>Natively Authored Content</h1>
15
- <p>This markup was written physically in the server file, captured by the engine, and isolated seamlessly.</p>
16
-
17
- <script src="app.js?vfs=true"></script>
15
+ <div class="js-card">
16
+ <h3>Service Worker Kernel Active</h3>
17
+ <p>This markup was written physically in the server file, captured by the engine, and isolated seamlessly.</p>
18
+ </div>
18
19
  </body>
19
20
  </html>
package/main.js CHANGED
@@ -1,77 +1,84 @@
1
1
  // main.js - Production Build Core Orchestrator
2
2
 
3
- window.vfs = {
4
- add(filename, contentString, customMime = null) {
5
- return window._vfsKernel.write(filename, contentString, customMime);
6
- },
7
- async importRemote(localFilename, remoteUrl, customMime = null) {
8
- try {
9
- const response = await fetch(remoteUrl);
10
- if (!response.ok) throw new Error(`HTTP network error: ${response.status}`);
11
- const text = await response.text();
12
- this.add(localFilename, text, customMime);
13
- return true;
14
- } catch (err) {
15
- console.error(`[VFS Proxy Error]`, err);
16
- return false;
17
- }
18
- }
19
- };
3
+ (function() {
4
+ if (window.self !== window.top) return;
20
5
 
21
- async function runProductionBuild() {
22
- // 1. Fetch remote script engine and write it into local cache immediately
23
- await vfs.importRemote('my-confetti-engine.js', 'https://cdn.jsdelivr.net/npm/canvas-confetti@1.9.4/dist/confetti.browser.min.js', 'text/javascript');
6
+ const encoder = new TextEncoder();
24
7
 
25
- // 2. Inject app.js with a small pool verification to bind the action button cleanly
26
- vfs.add('app.js', `
27
- console.log("Application loop booted inside clean VFS space!");
28
-
29
- document.addEventListener('DOMContentLoaded', () => {
30
- let container = document.querySelector('.js-card');
31
- if (!container) {
32
- container = document.createElement('div');
33
- container.className = 'js-card';
34
- container.innerHTML = '<h3>Automated Clean Shell Live</h3><p>The environment is isolated cleanly.</p>';
35
- document.body.appendChild(container);
36
- }
8
+ window.vfs = {
9
+ write(filename, contentString, customMime) {
10
+ if (!navigator.serviceWorker.controller) return false;
11
+ let cleanKey = filename.split('?')[0].split('/').pop();
37
12
 
38
- const button = document.createElement('button');
39
- button.id = 'action-btn';
40
- button.innerText = 'Trigger Confetti';
41
- container.appendChild(button);
13
+ if (!customMime) {
14
+ const ext = cleanKey.split('.').pop().toLowerCase();
15
+ const mimeMatrix = { 'js': 'text/javascript', 'css': 'text/css', 'html': 'text/html' };
16
+ customMime = mimeMatrix[ext] || 'application/octet-stream';
17
+ }
42
18
 
43
- // Robust polling wrapper to guarantee framework availability on click
44
- button.addEventListener('click', () => {
45
- const targetWindow = window.parent.vfs ? window.parent : window;
46
- if (typeof targetWindow.confetti === 'function') {
47
- targetWindow.confetti({ particleCount: 100, spread: 70, origin: { y: 0.6 } });
48
- } else if (typeof window.confetti === 'function') {
49
- window.confetti({ particleCount: 100, spread: 70, origin: { y: 0.6 } });
50
- } else {
51
- console.error("Confetti fallback execution error: Reference missing.");
52
- }
19
+ navigator.serviceWorker.controller.postMessage({
20
+ type: 'VFS_WRITE',
21
+ filename: cleanKey,
22
+ content: encoder.encode(contentString),
23
+ mime: customMime
53
24
  });
54
- });
55
- `, 'text/javascript');
25
+ return true;
26
+ },
27
+
28
+ async importRemote(localFilename, remoteUrl, customMime = null) {
29
+ try {
30
+ const response = await fetch(remoteUrl);
31
+ const text = await response.text();
32
+ this.write(localFilename, text, customMime);
33
+ return true;
34
+ } catch (err) {
35
+ console.error(`[VFS Proxy Fetch Fault]`, err);
36
+ return false;
37
+ }
38
+ }
39
+ };
40
+
41
+ window.runProductionBuild = async function() {
42
+ try {
43
+ // 1. Fetch raw, direct files from the server as plaintext strings
44
+ const [rawHtml, rawJs, rawCss] = await Promise.all([
45
+ fetch('./index.html').then(r => r.text()),
46
+ fetch('./app.js?vfs=true').then(r => r.text()).catch(() => ''),
47
+ fetch('./style.css?vfs=true').then(r => r.text()).catch(() => '')
48
+ ]);
56
49
 
57
- vfs.add('style.css', `
58
- body { background: #020617; color: #f8fafc; font-family: system-ui, sans-serif; text-align: center; padding: 50px; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 80vh; margin: 0; }
59
- h1 { color: #38bdf8; font-size: 2.5rem; }
60
- p { color: #94a3b8; max-width: 500px; }
61
- .js-card { background: #0f172a; border: 1px solid #1e293b; padding: 25px; border-radius: 12px; max-width: 400px; margin-top: 20px; }
62
- .js-card h3 { color: #34d399; margin-top: 0; }
63
- button { background: #38bdf8; color: #020617; border: none; padding: 12px 24px; font-weight: 600; border-radius: 6px; cursor: pointer; margin-top: 15px; }
64
- button:hover { background: #7dd3fc; }
65
- `, 'text/css');
50
+ // 2. Clean out infrastructure scripts from the HTML code string
51
+ let cleanHtml = rawHtml.replace(/<script\s+src="vfsjs\.js"><\/script>/gi, '');
52
+ cleanHtml = cleanHtml.replace(/<script\s+src="main\.js"><\/script>/gi, '');
66
53
 
67
- // 3. Open viewport canvas wrapper framework
68
- window._vfsKernel.openViewport();
69
- }
54
+ // 3. Commit user assets natively to the virtual mapping channel
55
+ window.vfs.write('app.js', rawJs, 'text/javascript');
56
+ window.vfs.write('style.css', rawCss, 'text/css');
70
57
 
71
- (function verifyKernelAvailability() {
72
- if (window._vfsKernel && navigator.serviceWorker && navigator.serviceWorker.controller) {
73
- runProductionBuild();
74
- } else {
75
- setTimeout(verifyKernelAvailability, 15);
76
- }
58
+ // 4. Mount third-party external dependencies natively
59
+ await window.vfs.importRemote('my-confetti-engine.js', 'https://cdn.jsdelivr.net/npm/canvas-confetti@1.9.4/dist/confetti.browser.min.js', 'text/javascript');
60
+
61
+ // 5. Build a synchronized sandbox route markup shell
62
+ const sandboxShell = `
63
+ <!DOCTYPE html>
64
+ <html>
65
+ <head>
66
+ <meta charset="UTF-8">
67
+ <link rel="stylesheet" href="style.css">
68
+ <script src="my-confetti-engine.js"><\/script>
69
+ </head>
70
+ <body>
71
+ ${cleanHtml.substring(cleanHtml.indexOf('<body>') + 6, cleanHtml.lastIndexOf('</body>'))}
72
+ <script src="app.js"><\/script>
73
+ </head>
74
+ </html>
75
+ `;
76
+ window.vfs.write('sandbox_runtime.html', sandboxShell, 'text/html');
77
+
78
+ // Launch viewport!
79
+ window._vfsKernel.openViewport();
80
+ } catch (err) {
81
+ console.error("VFS Build Engine Failure:", err);
82
+ }
83
+ };
77
84
  })();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vfsjs-test",
3
- "version": "1.0.28",
3
+ "version": "1.0.30",
4
4
  "description": "",
5
5
  "main": "index.html",
6
6
  "scripts": {
package/sw.js CHANGED
@@ -1,63 +1,44 @@
1
- // sw.js - Version 7.0.0 (Zero-Leak Network Interceptor)
1
+ // sw.js - Version 16.0.0 (Production Routing Layer)
2
+ const vfsCache = new Map();
2
3
 
3
- const virtualStorage = new Map();
4
+ self.addEventListener('install', (event) => {
5
+ self.skipWaiting();
6
+ });
4
7
 
5
- self.addEventListener('install', (e) => self.skipWaiting());
6
- self.addEventListener('activate', (e) => e.waitUntil(self.clients.claim()));
8
+ self.addEventListener('activate', (event) => {
9
+ event.waitUntil(self.clients.claim());
10
+ });
7
11
 
8
- // Message handling pipeline for window memory synchronizations
12
+ // PostMessage Memory Synchronizer Handler Link
9
13
  self.addEventListener('message', (event) => {
10
14
  if (event.data && event.data.type === 'VFS_WRITE') {
11
- virtualStorage.set(event.data.filename, {
12
- content: event.data.content, // Uint8Array binary format
13
- mime: event.data.mime
14
- });
15
+ const { filename, content, mime } = event.data;
16
+ vfsCache.set(filename, { content, mime });
15
17
  }
16
18
  });
17
19
 
18
- // The universal request routing core
19
20
  self.addEventListener('fetch', (event) => {
20
21
  const url = new URL(event.request.url);
21
-
22
- // Check if this request is explicitly targeting our virtual scope ecosystem
23
- if (url.searchParams.get('vfs') === 'true' || url.href.includes('vfs=true')) {
24
- const cleanFilename = url.pathname.split('/').pop() || 'index.html';
25
-
26
- // Match against memory cache database maps
27
- if (virtualStorage.has(cleanFilename)) {
28
- const cachedAsset = virtualStorage.get(cleanFilename);
29
- event.respondWith(
30
- new Response(cachedAsset.content, {
31
- status: 200,
32
- headers: {
33
- 'Content-Type': cachedAsset.mime,
34
- 'X-Content-Type-Options': 'nosniff' // Pass strict parsing checks
35
- }
36
- })
37
- );
38
- } else {
39
- // OPTION B CATCH-ALL: Banish unpkg network fallback crashes!
40
- // If main.js hasn't populated a script yet, serve a valid empty fallback shell script/style
41
- let fallbackBody = '';
42
- let fallbackMime = 'text/plain';
22
+ const filename = url.pathname.split('/').pop();
43
23
 
44
- if (cleanFilename.endsWith('.js')) {
45
- fallbackBody = `console.warn("VFS Interceptor: Dynamic fallback stub active for ${cleanFilename}");`;
46
- fallbackMime = 'text/javascript';
47
- } else if (cleanFilename.endsWith('.css')) {
48
- fallbackBody = `/* VFS Dynamic Style Fallback Stub */`;
49
- fallbackMime = 'text/css';
50
- } else if (cleanFilename.endsWith('.json')) {
51
- fallbackBody = '{}';
52
- fallbackMime = 'application/json';
53
- }
54
-
55
- event.respondWith(
56
- new Response(fallbackBody, {
57
- status: 200,
58
- headers: { 'Content-Type': fallbackMime }
59
- })
60
- );
61
- }
24
+ // 1. Intercept custom runtime canvas requests route structures
25
+ if (vfsCache.has(filename)) {
26
+ const cachedFile = vfsCache.get(filename);
27
+ event.respondWith(
28
+ new Response(cachedFile.content, {
29
+ status: 200,
30
+ headers: {
31
+ 'Content-Type': cachedFile.mime,
32
+ 'X-Content-Type-Options': 'nosniff',
33
+ 'Cache-Control': 'no-store, no-cache, must-revalidate'
34
+ }
35
+ })
36
+ );
37
+ return;
62
38
  }
39
+
40
+ // 2. FORCE SYSTEM ROOT INITIALIZATION SECURITY ASSURANCE:
41
+ // If the top-level frame requests index.html directly, bypass cache interception
42
+ // to allow vfsjs.js to read the original raw target files.
43
+ event.respondWith(fetch(event.request));
63
44
  });
package/vfsjs.js CHANGED
@@ -1,73 +1,48 @@
1
- // vfsjs.js - Version 12.0.0 (Zero-Leak Pure Extraction Engine)
1
+ // vfsjs.js - Version 16.0.0 (Core Production Bootloader)
2
2
  (function() {
3
+ // If executing inside the sandboxed iframe viewport, halt immediately
3
4
  if (window.self !== window.top) return;
4
5
 
5
- const encoder = new TextEncoder();
6
-
7
6
  const engineCore = {
8
7
  async init() {
9
- // Reassuring, bold console warning statement
10
- console.warn(
11
- "%c[VFS Kernel] NOTICE: Any 'MIME type text/plain' or 'NS_ERROR_CORRUPTED_CONTENT' logs above are expected Phase-1 browser artifacts. The engine gracefully isolates them.",
12
- "font-weight: bold; font-size: 11px;"
13
- );
14
-
8
+ console.log("%c[VFS Kernel] Initializing Core Infrastructure...", "color: #38bdf8; font-weight: bold;");
9
+
15
10
  try {
11
+ // Register the interceptor script path
16
12
  await navigator.serviceWorker.register('./sw.js');
17
13
  if (!navigator.serviceWorker.controller) {
18
14
  await new Promise(r => navigator.serviceWorker.addEventListener('controllerchange', r, { once: true }));
19
15
  }
20
-
21
- // Get raw HTML code strings cleanly
22
- let htmlString = `<!DOCTYPE html>\n<html>${document.documentElement.innerHTML}</html>`;
23
-
24
- // Wipe infrastructure script tags via string manipulation to block DOMParser leaks
25
- htmlString = htmlString.replace(/<script\s+src="vfsjs\.js"><\/script>/gi, '');
26
- htmlString = htmlString.replace(/<script\s+src="main\.js"><\/script>/gi, '');
27
-
28
- // Clean the parent view area completely
29
- document.documentElement.innerHTML = '<head><meta charset="UTF-8"><title>VFS Container Shell</title></head><body></body>';
30
16
 
31
- Object.assign(document.documentElement.style, { width: '100%', height: '100%', overflow: 'hidden', margin: '0', padding: '0' });
32
- Object.assign(document.body.style, { width: '100%', height: '100%', overflow: 'hidden', margin: '0', padding: '0', background: '#020617' });
33
-
34
- this.write('index.html', htmlString, 'text/html');
35
- return true;
17
+ // Let main orchestrator kick off file compilation
18
+ if (typeof window.runProductionBuild === 'function') {
19
+ await window.runProductionBuild();
20
+ }
36
21
  } catch (err) {
37
- console.error("VFS Extraction Fault:", err);
38
- return false;
22
+ console.error("VFS Kernel Registration Fault:", err);
39
23
  }
40
24
  },
41
25
 
42
26
  openViewport() {
43
- console.log("[VFS Kernel] Spawning isolated rendering viewport.");
27
+ if (document.getElementById('canvas-viewport')) return;
28
+
29
+ console.log("[VFS Kernel] Direct tags neutralized. Spawning isolated rendering viewport.");
30
+
31
+ // Standardize parent layer presentation properties
32
+ Object.assign(document.documentElement.style, { width: '100%', height: '100%', overflow: 'hidden', margin: '0' });
33
+ Object.assign(document.body.style, { width: '100%', height: '100%', overflow: 'hidden', background: '#020617', margin: '0' });
34
+ document.body.innerHTML = ''; // Safely clear host workspace
35
+
44
36
  const iframe = document.createElement('iframe');
45
37
  iframe.id = 'canvas-viewport';
46
38
  Object.assign(iframe.style, {
47
39
  position: 'fixed', top: '0', left: '0', width: '100%', height: '100%',
48
- border: 'none', margin: '0', padding: '0', zIndex: '999999', background: '#020617'
40
+ border: 'none', zIndex: '999999', background: '#020617'
49
41
  });
50
42
  document.body.appendChild(iframe);
51
- iframe.src = './index.html?vfs=true';
52
- },
53
-
54
- write(filename, contentString, customMime) {
55
- if (!navigator.serviceWorker.controller) return false;
56
- let cleanKey = filename.split('?')[0].split('/').pop();
57
43
 
58
- if (!customMime) {
59
- const ext = cleanKey.split('.').pop().toLowerCase();
60
- const mimeMatrix = { 'js': 'text/javascript', 'css': 'text/css', 'html': 'text/html', 'json': 'application/json' };
61
- customMime = mimeMatrix[ext] || 'application/octet-stream';
62
- }
63
-
64
- navigator.serviceWorker.controller.postMessage({
65
- type: 'VFS_WRITE',
66
- filename: cleanKey,
67
- content: encoder.encode(contentString),
68
- mime: customMime
69
- });
70
- return true;
44
+ // Request the dedicated target route inside the virtual scope
45
+ iframe.src = './sandbox_runtime.html';
71
46
  }
72
47
  };
73
48