工程開發
jupyter-notebook-testing avatar

jupyter-notebook-testing

使用 Jupyter Notebook 在瀏覽器中互動式測試 Adobe EDS 區塊。支援 ES6 匯入、疊加層預覽、響應式裝置測試,以及零依賴執行環境。

簡介

jupyter-notebook-testing 技能為 Adobe Edge Delivery Services (EDS) 提供了一個簡化且原生的瀏覽器開發環境。透過利用 ipynb-viewer 區塊,開發人員可以直接在 EDS 驅動的網站內建立、管理並執行 Jupyter Notebook。這種方法以即時、互動式的實驗取代了繁瑣的建置流程,允許開發人員在不離開瀏覽器的情況下快速疊代區塊裝飾、樣式與 DOM 操作。對於需要快速回饋以進行元件驗證的前端工程師、區塊開發人員與技術內容創作者而言,這是理想的工具。

  • 使用 ipynb-viewer 進行原生瀏覽器執行環境,以實現即時的 EDS 區塊渲染。

  • 提供先進的輔助函式,包括用於 DOM 裝飾的 testBlock() 以及用於疊加層視覺測試的 showPreview()。

  • 支援 ES6 匯入,允許從外部腳本模組化地測試輔助函式與區塊邏輯。

  • 整合響應式預覽系統,可在全螢幕疊加層內切換手機、平板與桌面檢視。

  • 遵循最小化 DOM 結構要求,確保區塊依據官方 EDS 模式進行裝飾。

  • 具備建立可執行文件的能力,讓使用者能與區塊演示進行互動。

  • 使用 scripts/ipynb-helpers.js 以確保在所有 Notebook 單元中存取工具的一致性。

  • 專為極簡依賴環境設計,完全相容於原生 JavaScript 工作流程。

  • 用於除錯 CSS、排除裝飾錯誤,以及在各種裝置斷點測試區塊響應式表現。

  • 在建立 Notebook 時,請確保每個單元皆透過區域匯入所需輔助工具,保持其獨立性。

  • 疊加層預覽可避免常見的瀏覽器限制(如彈出視窗封鎖程式),提供乾淨且持久的測試介面。

  • 當測試遵循標準 EDS 裝飾生命週期與區塊結構的元件時,此系統表現最佳。

  • 與更大型的 webcomponents-with-eds 架構相容,方便快速複製與改編現有的測試模板。

倉庫統計

Star 數
7
Fork 數
1
Open Issue 數
0
主要語言
Python
預設分支
main
同步狀態
閒置
最近同步時間
2026年5月3日 下午03:16
在 GitHub 查看