feat: Forge 4.0 professional editor chrome and real asset import proof

.github/workflows/platform-build.yml

@@ -0,0 +1,92 @@
+name: Forge Platform Builds
+on:
+  push:
+    branches: [vision-live-direct-fix2-2026-09-30]
+  workflow_dispatch:
+permissions:
+  contents: read
+concurrency:
+  group: forge-platform-${{ github.ref }}
+  cancel-in-progress: true
+jobs:
+  android:
+    runs-on: ubuntu-latest
+    timeout-minutes: 35
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+      - uses: actions/setup-java@v4
+        with:
+          distribution: temurin
+          java-version: "21"
+      - name: Prepare Web runtime
+        run: node scripts/package-web-project.mjs --project packaging/sample-project.forge.json
+      - name: Install Capacitor
+        working-directory: packaging/android
+        run: npm install
+      - name: Create Android project
+        working-directory: packaging/android
+        run: npx cap add android
+      - name: Sync Web runtime
+        working-directory: packaging/android
+        run: npx cap sync android
+      - name: Build Debug APK
+        working-directory: packaging/android/android
+        shell: bash
+        run: ./gradlew assembleDebug
+      - name: Upload Android APK
+        uses: actions/upload-artifact@v4
+        with:
+          name: forge-android-debug-apk
+          path: packaging/android/android/app/build/outputs/apk/debug/*.apk
+          if-no-files-found: error
+
+  windows:
+    runs-on: windows-latest
+    timeout-minutes: 25
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+      - name: Prepare Web runtime
+        run: node scripts/package-web-project.mjs --project packaging/sample-project.forge.json
+      - name: Install Electron Forge
+        working-directory: packaging/windows
+        run: npm install
+      - name: Build Windows package
+        working-directory: packaging/windows
+        run: npm run make
+      - name: Upload Windows package
+        uses: actions/upload-artifact@v4
+        with:
+          name: forge-windows-package
+          path: packaging/windows/out/make/**
+          if-no-files-found: error
+
+  packaging-proof:
+    runs-on: ubuntu-latest
+    needs: [android, windows]
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+      - name: Install test dependencies
+        run: npm install --no-audit --no-fund
+      - name: Install Chromium
+        run: npx playwright install --with-deps chromium
+      - name: Prepare Web runtime
+        run: node scripts/package-web-project.mjs --project packaging/sample-project.forge.json
+      - name: Validate packaged runtime manifest
+        run: node -e "const fs=require('fs'); const p=JSON.parse(fs.readFileSync('dist/forge-web/project.forge.json','utf8')); if(p.format!=='forge-project'||!fs.existsSync('dist/forge-web/index.html')||!fs.existsSync('dist/forge-web/build-info.json')) process.exit(1); console.log('Packaging manifest OK')"
+      - name: Browser boot proof for packaged runtime
+        run: npx playwright test tests/packaging-runtime.spec.mjs --project=desktop
+      - name: Upload packaged runtime proof
+        uses: actions/upload-artifact@v4
+        with:
+          name: forge-packaged-runtime-proof
+          path: test-results/packaged-runtime-proof.png
+          if-no-files-found: error

.github/workflows/proof.yml

@@ -20,7 +20,15 @@ jobs:
         with:
           node-version: 22
       - run: npm install
-      - run: npx playwright install --with-deps chromium
+      - name: Prepare browser runtime
+        shell: bash
+        run: |
+          if command -v google-chrome >/dev/null 2>&1; then
+            echo "PLAYWRIGHT_CHANNEL=chrome" >> "$GITHUB_ENV"
+            google-chrome --version
+          else
+            npx playwright install --with-deps chromium
+          fi
       - run: node scripts/validate-syntax.mjs
       - name: Upload syntax report
         if: always()
@@ -35,8 +43,6 @@ jobs:
         run: npm run test:professional
       - name: Live vision + real input acceptance
         run: npm run test:vision
-      - name: Live vision + real input acceptance
-        run: npm run test:vision
       - name: Khronos glTF validation
         run: npm run validate:gltf
       - name: Full regression suite
@@ -50,4 +56,5 @@ jobs:
             playwright-report
             test-results
             gltf-validation-report.json
+            vision-proof
           if-no-files-found: ignore

forge-draw2d.js

@@ -0,0 +1,223 @@
+(() => {
+  const $ = (id) => document.getElementById(id);
+  const state = {
+    canvas: null,
+    ctx: null,
+    drawing: false,
+    last: null,
+    erasing: false,
+    brush: 18,
+    color: "#ffffff",
+    history: [],
+    redo: [],
+    maxHistory: 24,
+    ready: false,
+    lastPngDataUrl: null,
+    importPromise: null
+  };
+
+  function dialog(){ return $("draw2dDialog"); }
+
+  function status(text){
+    const el = $("draw2dStatus");
+    if(el) el.textContent = text;
+  }
+
+  function capture(){
+    if(!state.ctx || !state.canvas) return;
+    state.history.push(state.ctx.getImageData(0,0,state.canvas.width,state.canvas.height));
+    if(state.history.length > state.maxHistory) state.history.shift();
+    state.redo.length = 0;
+    syncButtons();
+  }
+
+  function syncButtons(){
+    $("drawUndo")?.toggleAttribute("disabled", state.history.length < 2);
+    $("drawRedo")?.toggleAttribute("disabled", state.redo.length === 0);
+    $("drawEraser")?.classList.toggle("active", state.erasing);
+  }
+
+  function point(event){
+    const r=state.canvas.getBoundingClientRect();
+    return {
+      x:(event.clientX-r.left)*state.canvas.width/r.width,
+      y:(event.clientY-r.top)*state.canvas.height/r.height
+    };
+  }
+
+  function begin(event){
+    if(!state.ctx) return;
+    event.preventDefault();
+    capture();
+    state.drawing=true;
+    state.last=point(event);
+    state.canvas.setPointerCapture?.(event.pointerId);
+    state.ctx.save();
+    state.ctx.globalCompositeOperation=state.erasing?"destination-out":"source-over";
+    state.ctx.strokeStyle=state.color;
+    state.ctx.lineWidth=state.brush;
+    state.ctx.lineCap="round";
+    state.ctx.lineJoin="round";
+    state.ctx.beginPath();
+    state.ctx.arc(state.last.x,state.last.y,state.brush/2,0,Math.PI*2);
+    state.ctx.fillStyle=state.color;
+    if(state.erasing) state.ctx.fillStyle="rgba(0,0,0,1)";
+    state.ctx.fill();
+    state.ctx.restore();
+    status("Drawing…");
+  }
+
+  function move(event){
+    if(!state.drawing || !state.ctx) return;
+    event.preventDefault();
+    const p=point(event),a=state.last;
+    state.ctx.save();
+    state.ctx.globalCompositeOperation=state.erasing?"destination-out":"source-over";
+    state.ctx.strokeStyle=state.color;
+    state.ctx.lineWidth=state.brush;
+    state.ctx.lineCap="round";
+    state.ctx.lineJoin="round";
+    state.ctx.beginPath();
+    state.ctx.moveTo(a.x,a.y);
+    state.ctx.lineTo(p.x,p.y);
+    state.ctx.stroke();
+    state.ctx.restore();
+    state.last=p;
+  }
+
+  function end(event){
+    if(!state.drawing) return;
+    event?.preventDefault?.();
+    state.drawing=false;
+    state.last=null;
+    try{state.canvas.releasePointerCapture?.(event?.pointerId)}catch{}
+    status("Ready");
+  }
+
+  function clear(){
+    if(!state.ctx) return;
+    capture();
+    state.ctx.clearRect(0,0,state.canvas.width,state.canvas.height);
+    status("Canvas cleared");
+  }
+
+  function undo(){
+    if(state.history.length<=1 || !state.ctx)return;
+    const current=state.ctx.getImageData(0,0,state.canvas.width,state.canvas.height);
+    state.redo.push(current);
+    const previous=state.history.pop();
+    state.ctx.putImageData(previous,0,0);
+    syncButtons();
+    status("Undo");
+  }
+
+  function redo(){
+    if(!state.redo.length || !state.ctx)return;
+    const current=state.ctx.getImageData(0,0,state.canvas.width,state.canvas.height);
+    state.history.push(current);
+    const next=state.redo.pop();
+    state.ctx.putImageData(next,0,0);
+    syncButtons();
+    status("Redo");
+  }
+
+  function dataUrl(){
+    if(!state.canvas) return null;
+    return state.canvas.toDataURL("image/png");
+  }
+
+  function download(){
+    const url=dataUrl();
+    if(!url)return;
+    state.lastPngDataUrl=url;
+    const a=document.createElement("a");
+    a.href=url;
+    a.download="forge-drawing.png";
+    a.click();
+    status("PNG exported");
+  }
+
+  async function addToScene(){
+    if(!state.canvas || !window.Forge?.importFile) throw new Error("Forge runtime is not ready");
+    const blob=await new Promise(resolve=>state.canvas.toBlob(resolve,"image/png"));
+    if(!blob)throw new Error("PNG encoding failed");
+    const file=new File([blob],"forge-drawing.png",{type:"image/png"});
+    state.lastPngDataUrl=await new Promise((resolve,reject)=>{
+      const reader=new FileReader();
+      reader.onload=()=>resolve(String(reader.result||""));
+      reader.onerror=()=>reject(reader.error||new Error("PNG preview read failed"));
+      reader.readAsDataURL(blob);
+    });
+    await window.ForgeProduction?.assets?.storeFile?.(file);
+    const result=await window.Forge.importFile(file);
+    window.ForgeRefreshUI?.();
+    if(result?.record) window.Forge.select?.(result.record.id);
+    dialog()?.close();
+    status("Imported into Forge");
+    window.dispatchEvent(new CustomEvent("forge-drawing-imported",{detail:{name:file.name,bytes:file.size}}));
+    return {name:file.name,bytes:file.size,type:file.type};
+  }
+
+  function open(){
+    const d=dialog();
+    if(!d)throw new Error("2D paint dialog is missing");
+    try{
+      if(!d.open)d.showModal();
+    }catch{
+      d.setAttribute("open","");
+      d.style.display="block";
+    }
+    status("Ready");
+    syncButtons();
+    return{open:!!d.open,ready:state.ready};
+  }
+
+  function init(){
+    if(state.ready)return;
+    state.canvas=$("drawCanvas");
+    state.ctx=state.canvas?.getContext("2d");
+    if(!state.canvas||!state.ctx)return;
+    state.canvas.style.touchAction="none";
+    state.canvas.addEventListener("pointerdown",begin);
+    state.canvas.addEventListener("pointermove",move);
+    state.canvas.addEventListener("pointerup",end);
+    state.canvas.addEventListener("pointercancel",end);
+    state.canvas.addEventListener("pointerleave",(e)=>{if(state.drawing)move(e)});
+    $("draw2dOpen")?.addEventListener("click",open);
+    $("drawClose")?.addEventListener("click",()=>dialog()?.close());
+    $("drawClear")?.addEventListener("click",clear);
+    $("drawUndo")?.addEventListener("click",undo);
+    $("drawRedo")?.addEventListener("click",redo);
+    $("drawDownload")?.addEventListener("click",download);
+    $("drawAddToScene")?.addEventListener("click",()=>{
+      state.importPromise=addToScene().catch(e=>{
+        status("Import failed: "+(e?.message||String(e)));
+        throw e;
+      }).finally(()=>{state.importPromise=null});
+    });
+    $("drawColor")?.addEventListener("input",e=>{state.color=e.target.value||"#ffffff"});
+    $("drawSize")?.addEventListener("input",e=>{state.brush=Math.max(1,Math.min(120,Number(e.target.value)||18));$("drawSizeValue").textContent=state.brush+" px"});
+    $("drawEraser")?.addEventListener("click",()=>{state.erasing=!state.erasing;syncButtons()});
+    $("drawReset")?.addEventListener("click",()=>{state.color="#ffffff";state.brush=18;state.erasing=false;$("drawColor").value="#ffffff";$("drawSize").value="18";$("drawSizeValue").textContent="18 px";syncButtons()});
+    state.ctx.clearRect(0,0,state.canvas.width,state.canvas.height);
+    state.ctx.fillStyle="rgba(8,20,35,0)";
+    capture();
+    state.ready=true;
+    syncButtons();
+  }
+
+  window.ForgeDraw2D={
+    open,
+    clear,
+    undo,
+    redo,
+    download,
+    addToScene,
+    exportDataUrl:dataUrl,
+    status:()=>({ready:state.ready,drawing:state.drawing,brush:state.brush,color:state.color,erasing:state.erasing,history:state.history.length,redo:state.redo.length}),
+    get lastPngDataUrl(){ return state.lastPngDataUrl; },
+    waitForImport:()=>state.importPromise||Promise.resolve(true)
+  };
+
+  init();
+})();