@vizhub/runtime 0.1.4 → 0.3.0

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 (291) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +376 -178
  3. package/dist/buildHTML.d.ts +14 -0
  4. package/dist/buildHTML.js +67 -0
  5. package/dist/common/packageJson.d.ts +39 -0
  6. package/dist/common/packageJson.js +71 -0
  7. package/dist/common/packageJson.test.d.ts +1 -0
  8. package/dist/common/packageJson.test.js +146 -0
  9. package/dist/common/sucrasePlugin.d.ts +2 -0
  10. package/dist/common/sucrasePlugin.js +24 -0
  11. package/dist/common/virtualFileSystem.d.ts +3 -0
  12. package/dist/common/virtualFileSystem.js +75 -0
  13. package/dist/determineRuntimeVersion.d.ts +3 -0
  14. package/dist/determineRuntimeVersion.js +22 -0
  15. package/dist/determineRuntimeVersion.test.d.ts +1 -0
  16. package/dist/determineRuntimeVersion.test.js +101 -0
  17. package/dist/fixtures/basicHTML.d.ts +2 -0
  18. package/dist/fixtures/basicHTML.js +22 -0
  19. package/dist/fixtures/fetchProxy.d.ts +2 -0
  20. package/dist/fixtures/fetchProxy.js +25 -0
  21. package/dist/fixtures/index.d.ts +3 -0
  22. package/dist/fixtures/index.js +9 -0
  23. package/dist/fixtures/jsScriptTag.d.ts +2 -0
  24. package/dist/fixtures/jsScriptTag.js +19 -0
  25. package/dist/index.d.ts +3 -8
  26. package/dist/index.js +3 -24890
  27. package/dist/index.test.d.ts +1 -0
  28. package/dist/index.test.js +50 -0
  29. package/dist/magicSandbox/fixProtocollessUrls.d.ts +4 -0
  30. package/dist/magicSandbox/fixProtocollessUrls.js +10 -0
  31. package/dist/magicSandbox/generateInterceptorScript.d.ts +4 -0
  32. package/dist/magicSandbox/generateInterceptorScript.js +178 -0
  33. package/dist/magicSandbox/index.d.ts +19 -0
  34. package/dist/magicSandbox/index.js +48 -0
  35. package/dist/test/fixtures/basicHTML.d.ts +2 -0
  36. package/dist/test/fixtures/basicHTML.js +19 -0
  37. package/dist/test/fixtures/fetchProxy.d.ts +2 -0
  38. package/dist/test/fixtures/fetchProxy.js +22 -0
  39. package/dist/test/fixtures/index.d.ts +6 -0
  40. package/dist/test/fixtures/index.js +6 -0
  41. package/dist/test/fixtures/jsScriptTag.d.ts +2 -0
  42. package/dist/test/fixtures/jsScriptTag.js +16 -0
  43. package/dist/test/fixtures/magicSandbox/basicHTML.d.ts +5 -0
  44. package/dist/test/fixtures/magicSandbox/basicHTML.js +17 -0
  45. package/dist/test/fixtures/magicSandbox/fetchProxy.d.ts +11 -0
  46. package/dist/test/fixtures/magicSandbox/fetchProxy.js +18 -0
  47. package/dist/test/fixtures/magicSandbox/index.d.ts +6 -0
  48. package/dist/test/fixtures/magicSandbox/index.js +6 -0
  49. package/dist/test/fixtures/magicSandbox/jsScriptTag.d.ts +8 -0
  50. package/dist/test/fixtures/magicSandbox/jsScriptTag.js +13 -0
  51. package/dist/test/fixtures/magicSandbox/protocolTest.d.ts +5 -0
  52. package/dist/test/fixtures/magicSandbox/protocolTest.js +17 -0
  53. package/dist/test/fixtures/magicSandbox/styleTest.d.ts +8 -0
  54. package/dist/test/fixtures/magicSandbox/styleTest.js +19 -0
  55. package/dist/test/fixtures/magicSandbox/xmlTest.d.ts +8 -0
  56. package/dist/test/fixtures/magicSandbox/xmlTest.js +23 -0
  57. package/dist/test/fixtures/protocolTest.d.ts +2 -0
  58. package/dist/test/fixtures/protocolTest.js +19 -0
  59. package/dist/test/fixtures/styleTest.d.ts +2 -0
  60. package/dist/test/fixtures/styleTest.js +22 -0
  61. package/dist/test/fixtures/v1/basicHTML.d.ts +3 -0
  62. package/dist/test/fixtures/v1/basicHTML.js +15 -0
  63. package/dist/test/fixtures/v1/fetchProxy.d.ts +5 -0
  64. package/dist/test/fixtures/v1/fetchProxy.js +12 -0
  65. package/dist/test/fixtures/v1/index.d.ts +6 -0
  66. package/dist/test/fixtures/v1/index.js +6 -0
  67. package/dist/test/fixtures/v1/jsScriptTag.d.ts +4 -0
  68. package/dist/test/fixtures/v1/jsScriptTag.js +9 -0
  69. package/dist/test/fixtures/v1/protocolTest.d.ts +3 -0
  70. package/dist/test/fixtures/v1/protocolTest.js +15 -0
  71. package/dist/test/fixtures/v1/styleTest.d.ts +4 -0
  72. package/dist/test/fixtures/v1/styleTest.js +15 -0
  73. package/dist/test/fixtures/v1/xmlTest.d.ts +4 -0
  74. package/dist/test/fixtures/v1/xmlTest.js +19 -0
  75. package/dist/test/fixtures/v2/basicBundle.d.ts +5 -0
  76. package/dist/test/fixtures/v2/basicBundle.js +5 -0
  77. package/dist/test/fixtures/v2/basicBundleNoExtension.d.ts +5 -0
  78. package/dist/test/fixtures/v2/basicBundleNoExtension.js +5 -0
  79. package/dist/test/fixtures/v2/d3Import.d.ts +4 -0
  80. package/dist/test/fixtures/v2/d3Import.js +7 -0
  81. package/dist/test/fixtures/v2/d3ImportPkg.d.ts +5 -0
  82. package/dist/test/fixtures/v2/d3ImportPkg.js +19 -0
  83. package/dist/test/fixtures/v2/d3RosettaImportPkg.d.ts +5 -0
  84. package/dist/test/fixtures/v2/d3RosettaImportPkg.js +19 -0
  85. package/dist/test/fixtures/v2/es6Preserve.d.ts +4 -0
  86. package/dist/test/fixtures/v2/es6Preserve.js +6 -0
  87. package/dist/test/fixtures/v2/generatorSupport.d.ts +4 -0
  88. package/dist/test/fixtures/v2/generatorSupport.js +6 -0
  89. package/dist/test/fixtures/v2/index.d.ts +14 -0
  90. package/dist/test/fixtures/v2/index.js +15 -0
  91. package/dist/test/fixtures/v2/jsxTranspile.d.ts +4 -0
  92. package/dist/test/fixtures/v2/jsxTranspile.js +6 -0
  93. package/dist/test/fixtures/v2/reactDomImport.d.ts +4 -0
  94. package/dist/test/fixtures/v2/reactDomImport.js +8 -0
  95. package/dist/test/fixtures/v2/reactDomImportPkg.d.ts +5 -0
  96. package/dist/test/fixtures/v2/reactDomImportPkg.js +24 -0
  97. package/dist/test/fixtures/v2/reactImport.d.ts +4 -0
  98. package/dist/test/fixtures/v2/reactImport.js +7 -0
  99. package/dist/test/fixtures/v2/reactImportPkg.d.ts +5 -0
  100. package/dist/test/fixtures/v2/reactImportPkg.js +17 -0
  101. package/dist/test/fixtures/v2/sourceMapErrorFixture.d.ts +5 -0
  102. package/dist/test/fixtures/v2/sourceMapErrorFixture.js +19 -0
  103. package/dist/test/fixtures/v2/unicodeSupport.d.ts +4 -0
  104. package/dist/test/fixtures/v2/unicodeSupport.js +6 -0
  105. package/dist/test/fixtures/v3/basicIndexJS.d.ts +3 -0
  106. package/dist/test/fixtures/v3/basicIndexJS.js +7 -0
  107. package/dist/test/fixtures/v3/cssImport.d.ts +4 -0
  108. package/dist/test/fixtures/v3/cssImport.js +9 -0
  109. package/dist/test/fixtures/v3/csvImport.d.ts +4 -0
  110. package/dist/test/fixtures/v3/csvImport.js +11 -0
  111. package/dist/test/fixtures/v3/csvStrangeChars.d.ts +4 -0
  112. package/dist/test/fixtures/v3/csvStrangeChars.js +12 -0
  113. package/dist/test/fixtures/v3/index.d.ts +9 -0
  114. package/dist/test/fixtures/v3/index.js +9 -0
  115. package/dist/test/fixtures/v3/jsExport.d.ts +4 -0
  116. package/dist/test/fixtures/v3/jsExport.js +10 -0
  117. package/dist/test/fixtures/v3/sourcemap.d.ts +3 -0
  118. package/dist/test/fixtures/v3/sourcemap.js +10 -0
  119. package/dist/test/fixtures/v3/svelte.d.ts +4 -0
  120. package/dist/test/fixtures/v3/svelte.js +18 -0
  121. package/dist/test/fixtures/v3/vizContent.d.ts +2 -0
  122. package/dist/test/fixtures/v3/vizContent.js +11 -0
  123. package/dist/test/fixtures/v3/vizImport.d.ts +6 -0
  124. package/dist/test/fixtures/v3/vizImport.js +85 -0
  125. package/dist/test/fixtures/v4/d3Usage.d.ts +5 -0
  126. package/dist/test/fixtures/v4/d3Usage.js +31 -0
  127. package/dist/test/fixtures/v4/esmBuild.d.ts +5 -0
  128. package/dist/test/fixtures/v4/esmBuild.js +18 -0
  129. package/dist/test/fixtures/v4/fetchInterception.d.ts +5 -0
  130. package/dist/test/fixtures/v4/fetchInterception.js +18 -0
  131. package/dist/test/fixtures/v4/index.d.ts +9 -0
  132. package/dist/test/fixtures/v4/index.js +9 -0
  133. package/dist/test/fixtures/v4/jsScriptTagTypeModule.d.ts +4 -0
  134. package/dist/test/fixtures/v4/jsScriptTagTypeModule.js +18 -0
  135. package/dist/test/fixtures/v4/jsScriptTagTypeModules.d.ts +5 -0
  136. package/dist/test/fixtures/v4/jsScriptTagTypeModules.js +12 -0
  137. package/dist/test/fixtures/v4/reactHooks.d.ts +6 -0
  138. package/dist/test/fixtures/v4/reactHooks.js +47 -0
  139. package/dist/test/fixtures/v4/reactJsx.d.ts +6 -0
  140. package/dist/test/fixtures/v4/reactJsx.js +34 -0
  141. package/dist/test/fixtures/v4/threeJsUsage.d.ts +4 -0
  142. package/dist/test/fixtures/v4/threeJsUsage.js +24 -0
  143. package/dist/test/fixtures/v4/typeScriptSupport.d.ts +5 -0
  144. package/dist/test/fixtures/v4/typeScriptSupport.js +29 -0
  145. package/dist/test/fixtures/xmlTest.d.ts +2 -0
  146. package/dist/test/fixtures/xmlTest.js +26 -0
  147. package/dist/test/index.test.d.ts +1 -0
  148. package/dist/test/index.test.js +40 -0
  149. package/dist/test/testInBrowser.d.ts +15 -0
  150. package/dist/test/testInBrowser.js +47 -0
  151. package/dist/test/testStackTrace.d.ts +9 -0
  152. package/dist/test/testStackTrace.js +55 -0
  153. package/dist/test/v1.test.d.ts +1 -0
  154. package/dist/test/v1.test.js +65 -0
  155. package/dist/test/v2.test.d.ts +1 -0
  156. package/dist/test/v2.test.js +121 -0
  157. package/dist/test/v3.test.d.ts +1 -0
  158. package/dist/test/v3.test.js +114 -0
  159. package/dist/test/v4.test.d.ts +1 -0
  160. package/dist/test/v4.test.js +100 -0
  161. package/dist/types.d.ts +1 -0
  162. package/dist/types.js +1 -0
  163. package/dist/utils/getFileText.d.ts +2 -0
  164. package/dist/utils/getFileText.js +13 -0
  165. package/dist/utils/getFileText.test.d.ts +1 -0
  166. package/dist/utils/getFileText.test.js +72 -0
  167. package/dist/utils/vizContentToFileCollection.d.ts +7 -0
  168. package/dist/utils/vizContentToFileCollection.js +19 -0
  169. package/dist/utils/vizContentToFileCollection.test.d.ts +1 -0
  170. package/dist/utils/vizContentToFileCollection.test.js +75 -0
  171. package/dist/v2/computeBundleJSV2.d.ts +7 -0
  172. package/dist/v2/computeBundleJSV2.js +29 -0
  173. package/dist/v2/getComputedIndexHtml.d.ts +4 -0
  174. package/dist/v2/getComputedIndexHtml.js +81 -0
  175. package/dist/v2/getComputedIndexHtml.test.d.ts +1 -0
  176. package/dist/v2/getComputedIndexHtml.test.js +134 -0
  177. package/dist/v2/index.d.ts +1 -0
  178. package/dist/v2/index.js +1 -0
  179. package/dist/v2/v2Build.d.ts +7 -0
  180. package/dist/v2/v2Build.js +11 -0
  181. package/dist/{v3Runtime → v3}/cleanRollupErrorMessage.d.ts +0 -1
  182. package/dist/v3/cleanRollupErrorMessage.js +9 -0
  183. package/dist/v3/computeBundleJSV3.d.ts +17 -0
  184. package/dist/v3/computeBundleJSV3.js +48 -0
  185. package/dist/v3/createVizContent.d.ts +8 -0
  186. package/dist/v3/createVizContent.js +23 -0
  187. package/dist/{v3Runtime → v3}/extractVizImport.d.ts +2 -3
  188. package/dist/v3/extractVizImport.js +23 -0
  189. package/dist/v3/extractVizImport.test.d.ts +1 -0
  190. package/dist/v3/extractVizImport.test.js +30 -0
  191. package/dist/v3/htmlTemplate.d.ts +5 -0
  192. package/dist/v3/htmlTemplate.js +89 -0
  193. package/dist/v3/index.d.ts +1 -0
  194. package/dist/v3/index.js +1 -0
  195. package/dist/v3/parseId.d.ts +6 -0
  196. package/dist/v3/parseId.js +5 -0
  197. package/dist/v3/parseId.test.d.ts +1 -0
  198. package/dist/v3/parseId.test.js +25 -0
  199. package/dist/{v3Runtime → v3}/setupV3Runtime.d.ts +5 -5
  200. package/dist/v3/setupV3Runtime.js +341 -0
  201. package/dist/v3/slugCache.d.ts +11 -0
  202. package/dist/v3/slugCache.js +35 -0
  203. package/dist/v3/slugCache.test.d.ts +1 -0
  204. package/dist/v3/slugCache.test.js +105 -0
  205. package/dist/v3/transformDSV/dsvParseSrc.d.ts +1 -0
  206. package/dist/v3/transformDSV/dsvParseSrc.js +121 -0
  207. package/dist/v3/transformDSV/index.d.ts +2 -0
  208. package/dist/v3/transformDSV/index.js +40 -0
  209. package/dist/{v3Runtime → v3}/transformSvelte.d.ts +4 -2
  210. package/dist/v3/transformSvelte.js +77 -0
  211. package/dist/{v3Runtime → v3}/types.d.ts +18 -18
  212. package/dist/v3/types.js +1 -0
  213. package/dist/v3/v3Build.d.ts +14 -0
  214. package/dist/v3/v3Build.js +30 -0
  215. package/dist/v3/vizCache.d.ts +10 -0
  216. package/dist/v3/vizCache.js +36 -0
  217. package/dist/v3/vizCache.test.d.ts +1 -0
  218. package/dist/v3/vizCache.test.js +98 -0
  219. package/dist/{v3Runtime → v3}/vizLoad.d.ts +3 -4
  220. package/dist/v3/vizLoad.js +46 -0
  221. package/dist/v3/vizResolve.d.ts +7 -0
  222. package/dist/v3/vizResolve.js +69 -0
  223. package/dist/v4/index.d.ts +10 -0
  224. package/dist/v4/index.js +134 -0
  225. package/package.json +37 -38
  226. package/dist/assets/setupV3Runtime-BVr5lyKp.js +0 -240
  227. package/dist/computeSrcDoc.d.ts +0 -13
  228. package/dist/computeSrcDoc.d.ts.map +0 -1
  229. package/dist/computeSrcDoc.test.d.ts +0 -2
  230. package/dist/computeSrcDoc.test.d.ts.map +0 -1
  231. package/dist/index.d.ts.map +0 -1
  232. package/dist/useRuntime.d.ts +0 -13
  233. package/dist/useRuntime.d.ts.map +0 -1
  234. package/dist/v2Runtime/bundle/bubleJSXOnly.d.ts +0 -5
  235. package/dist/v2Runtime/bundle/bubleJSXOnly.d.ts.map +0 -1
  236. package/dist/v2Runtime/bundle/packageJson.d.ts +0 -10
  237. package/dist/v2Runtime/bundle/packageJson.d.ts.map +0 -1
  238. package/dist/v2Runtime/computeSrcDocV2.d.ts +0 -3
  239. package/dist/v2Runtime/computeSrcDocV2.d.ts.map +0 -1
  240. package/dist/v2Runtime/computeSrcDocV2.test.d.ts +0 -2
  241. package/dist/v2Runtime/computeSrcDocV2.test.d.ts.map +0 -1
  242. package/dist/v2Runtime/getComputedIndexHtml.d.ts +0 -4
  243. package/dist/v2Runtime/getComputedIndexHtml.d.ts.map +0 -1
  244. package/dist/v2Runtime/getComputedIndexHtml.test.d.ts +0 -2
  245. package/dist/v2Runtime/getComputedIndexHtml.test.d.ts.map +0 -1
  246. package/dist/v2Runtime/getText.d.ts +0 -3
  247. package/dist/v2Runtime/getText.d.ts.map +0 -1
  248. package/dist/v2Runtime/transformFiles.d.ts +0 -3
  249. package/dist/v2Runtime/transformFiles.d.ts.map +0 -1
  250. package/dist/v2Runtime/v3FilesToV2Files.d.ts +0 -3
  251. package/dist/v2Runtime/v3FilesToV2Files.d.ts.map +0 -1
  252. package/dist/v2Runtime/v3FilesToV2Files.test.d.ts +0 -2
  253. package/dist/v2Runtime/v3FilesToV2Files.test.d.ts.map +0 -1
  254. package/dist/v3Runtime/build.d.ts +0 -14
  255. package/dist/v3Runtime/build.d.ts.map +0 -1
  256. package/dist/v3Runtime/build.test.d.ts +0 -2
  257. package/dist/v3Runtime/build.test.d.ts.map +0 -1
  258. package/dist/v3Runtime/cleanRollupErrorMessage.d.ts.map +0 -1
  259. package/dist/v3Runtime/computeSrcDocV3.d.ts +0 -7
  260. package/dist/v3Runtime/computeSrcDocV3.d.ts.map +0 -1
  261. package/dist/v3Runtime/extractVizImport.d.ts.map +0 -1
  262. package/dist/v3Runtime/extractVizImport.test.d.ts +0 -2
  263. package/dist/v3Runtime/extractVizImport.test.d.ts.map +0 -1
  264. package/dist/v3Runtime/generateRollupErrorMessage.d.ts +0 -5
  265. package/dist/v3Runtime/generateRollupErrorMessage.d.ts.map +0 -1
  266. package/dist/v3Runtime/importFromViz.d.ts +0 -1
  267. package/dist/v3Runtime/importFromViz.d.ts.map +0 -1
  268. package/dist/v3Runtime/index.d.ts +0 -2
  269. package/dist/v3Runtime/index.d.ts.map +0 -1
  270. package/dist/v3Runtime/parseId.d.ts +0 -7
  271. package/dist/v3Runtime/parseId.d.ts.map +0 -1
  272. package/dist/v3Runtime/setupV3Runtime.d.ts.map +0 -1
  273. package/dist/v3Runtime/transformDSV/index.d.ts +0 -3
  274. package/dist/v3Runtime/transformDSV/index.d.ts.map +0 -1
  275. package/dist/v3Runtime/transformSvelte.d.ts.map +0 -1
  276. package/dist/v3Runtime/types.d.ts.map +0 -1
  277. package/dist/v3Runtime/urlLoad.d.ts +0 -1
  278. package/dist/v3Runtime/urlLoad.d.ts.map +0 -1
  279. package/dist/v3Runtime/virtual.d.ts +0 -1
  280. package/dist/v3Runtime/virtual.d.ts.map +0 -1
  281. package/dist/v3Runtime/vizCache.d.ts +0 -11
  282. package/dist/v3Runtime/vizCache.d.ts.map +0 -1
  283. package/dist/v3Runtime/vizCache.test.d.ts +0 -2
  284. package/dist/v3Runtime/vizCache.test.d.ts.map +0 -1
  285. package/dist/v3Runtime/vizLoad.d.ts.map +0 -1
  286. package/dist/v3Runtime/vizLoadSvelte.d.ts +0 -1
  287. package/dist/v3Runtime/vizLoadSvelte.d.ts.map +0 -1
  288. package/dist/v3Runtime/vizResolve.d.ts +0 -10
  289. package/dist/v3Runtime/vizResolve.d.ts.map +0 -1
  290. package/dist/v3Runtime/worker.d.ts +0 -2
  291. package/dist/v3Runtime/worker.d.ts.map +0 -1
@@ -0,0 +1,85 @@
1
+ // Sample content for testing JS imports
2
+ export const sampleContent = {
3
+ id: "84bddfb1cc0545f299e5083c3e71e0bb",
4
+ files: {
5
+ "7548392": {
6
+ name: "index.js",
7
+ text: `
8
+ import { innerMessage } from './message';
9
+ export const message = "Outer " + innerMessage;
10
+ `,
11
+ },
12
+ "6714854": {
13
+ name: "message.js",
14
+ text: `
15
+ export const innerMessage = "Inner";
16
+ `,
17
+ },
18
+ },
19
+ title: "Sample Content for Exporting",
20
+ };
21
+ // Sample content for testing JS imports
22
+ // across vizzes by id
23
+ export const sampleContentVizImport = {
24
+ id: "a6014044e0c6425f911a7e128e1928a6",
25
+ files: {
26
+ "7548392": {
27
+ name: "index.js",
28
+ text: `
29
+ import { message } from '@joe/${sampleContent.id}';
30
+ console.log("Imported from viz: " + message);
31
+ `,
32
+ },
33
+ },
34
+ title: "Sample Content for Viz Importing",
35
+ };
36
+ // Sample content for testing JS imports
37
+ // across vizzes by slug
38
+ export const sampleContentVizImportSlug = {
39
+ id: "6f8aec8c3cd348d7a7d4661cc8d75c9a",
40
+ files: {
41
+ "7548392": {
42
+ name: "index.js",
43
+ text: `
44
+ import { message } from '@joe/sample-content-slug';
45
+ console.log("Imported from viz with slug: " + message);
46
+ `,
47
+ },
48
+ },
49
+ title: "Sample Content for Viz Importing",
50
+ };
51
+ // Sample content for testing CSS imports
52
+ export const sampleContentWithCSS = {
53
+ id: "cd52ba7f80834807b72e66ce4abac185",
54
+ files: {
55
+ "5473849": {
56
+ name: "index.js",
57
+ text: `
58
+ import './styles.css';
59
+ `,
60
+ },
61
+ "0175432": {
62
+ name: "styles.css",
63
+ text: `
64
+ body { color: red; }
65
+ `,
66
+ },
67
+ },
68
+ title: "Sample Content for CSS Importing",
69
+ };
70
+ // Sample content for testing CSS imports
71
+ // across vizzes
72
+ export const sampleContentVizImportWithCSS = {
73
+ id: "816040d214484b41b653bd6916a11fd9",
74
+ files: {
75
+ "7548392": {
76
+ name: "index.js",
77
+ text: `
78
+ // Import for the CSS side effect
79
+ import '@joe/${sampleContentWithCSS.id}';
80
+ console.log(getComputedStyle(document.body).color);
81
+ `,
82
+ },
83
+ },
84
+ title: "Sample Content for Viz Importing with CSS",
85
+ };
@@ -0,0 +1,5 @@
1
+ export declare const d3Usage: {
2
+ "index.html": string;
3
+ "index.js": string;
4
+ "package.json": string;
5
+ };
@@ -0,0 +1,31 @@
1
+ export const d3Usage = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>D3 Test</title>
6
+ </head>
7
+ <body>
8
+ <div id="chart"></div>
9
+ <script type="module" src="index.js"></script>
10
+ </body>
11
+ </html>`,
12
+ "index.js": `import * as d3 from 'd3';
13
+
14
+ const svg = d3.select('#chart')
15
+ .append('svg')
16
+ .attr('width', 100)
17
+ .attr('height', 100);
18
+
19
+ svg.append('circle')
20
+ .attr('cx', 50)
21
+ .attr('cy', 50)
22
+ .attr('r', 40)
23
+ .style('fill', 'blue');
24
+
25
+ console.log('D3 chart rendered successfully');`,
26
+ "package.json": `{
27
+ "dependencies": {
28
+ "d3": "^7.8.5"
29
+ }
30
+ }`,
31
+ };
@@ -0,0 +1,5 @@
1
+ export declare const esmBuild: {
2
+ "index.html": string;
3
+ "index.js": string;
4
+ "package.json": string;
5
+ };
@@ -0,0 +1,18 @@
1
+ export const esmBuild = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>ESM Build Test</title>
6
+ </head>
7
+ <body>
8
+ <script type="module" src="index.js"></script>
9
+ </body>
10
+ </html>`,
11
+ "index.js": `import { format } from 'date-fns';
12
+ console.log(format(new Date(), 'yyyy-MM-dd'));`,
13
+ "package.json": `{
14
+ "dependencies": {
15
+ "date-fns": "2.30.0"
16
+ }
17
+ }`,
18
+ };
@@ -0,0 +1,5 @@
1
+ export declare const fetchInterception: {
2
+ "index.html": string;
3
+ "index.js": string;
4
+ "data.json": string;
5
+ };
@@ -0,0 +1,18 @@
1
+ export const fetchInterception = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>Fetch Interception Test</title>
6
+ </head>
7
+ <body>
8
+ <script type="module" src="index.js"></script>
9
+ </body>
10
+ </html>`,
11
+ "index.js": `
12
+ fetch("data.json")
13
+ .then(response => response.json())
14
+ .then(data => console.log(data.message));`,
15
+ "data.json": `{
16
+ "message": "Fetch intercepted successfully"
17
+ }`,
18
+ };
@@ -0,0 +1,9 @@
1
+ export { jsScriptTagTypeModule } from "./jsScriptTagTypeModule";
2
+ export { jsScriptTagTypeModules } from "./jsScriptTagTypeModules";
3
+ export { fetchInterception } from "./fetchInterception";
4
+ export { esmBuild } from "./esmBuild";
5
+ export { reactJsx } from "./reactJsx";
6
+ export { d3Usage } from "./d3Usage";
7
+ export { threeJsUsage } from "./threeJsUsage";
8
+ export { reactHooks } from "./reactHooks";
9
+ export { typeScriptSupport } from "./typeScriptSupport";
@@ -0,0 +1,9 @@
1
+ export { jsScriptTagTypeModule } from "./jsScriptTagTypeModule";
2
+ export { jsScriptTagTypeModules } from "./jsScriptTagTypeModules";
3
+ export { fetchInterception } from "./fetchInterception";
4
+ export { esmBuild } from "./esmBuild";
5
+ export { reactJsx } from "./reactJsx";
6
+ export { d3Usage } from "./d3Usage";
7
+ export { threeJsUsage } from "./threeJsUsage";
8
+ export { reactHooks } from "./reactHooks";
9
+ export { typeScriptSupport } from "./typeScriptSupport";
@@ -0,0 +1,4 @@
1
+ export declare const jsScriptTagTypeModule: {
2
+ "index.html": string;
3
+ "index.js": string;
4
+ };
@@ -0,0 +1,18 @@
1
+ export const jsScriptTagTypeModule = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <script type="importmap">
6
+ {
7
+ "imports": {
8
+ "greeter": "data:text/javascript;charset=utf-8,export const greeting = \\"Hello, ES Module!\\";"
9
+ }
10
+ }
11
+ </script>
12
+ </head>
13
+ <body>
14
+ <script type="module" src="index.js"></script>
15
+ </body>
16
+ </html>`,
17
+ "index.js": `import { greeting } from 'greeter';\nconsole.log(greeting);`,
18
+ };
@@ -0,0 +1,5 @@
1
+ export declare const jsScriptTagTypeModules: {
2
+ "index.html": string;
3
+ "index.js": string;
4
+ "greeter.js": string;
5
+ };
@@ -0,0 +1,12 @@
1
+ export const jsScriptTagTypeModules = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ </head>
6
+ <body>
7
+ <script type="module" src="index.js"></script>
8
+ </body>
9
+ </html>`,
10
+ "index.js": `import { greeting } from './greeter.js';\nconsole.log(greeting);`,
11
+ "greeter.js": `export const greeting = "Hello, ES Module File!";`,
12
+ };
@@ -0,0 +1,6 @@
1
+ export declare const reactHooks: {
2
+ "index.html": string;
3
+ "index.jsx": string;
4
+ "Counter.jsx": string;
5
+ "package.json": string;
6
+ };
@@ -0,0 +1,47 @@
1
+ export const reactHooks = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>React Hooks Test</title>
6
+ </head>
7
+ <body>
8
+ <div id="root"></div>
9
+ <script type="module" src="index.jsx"></script>
10
+ </body>
11
+ </html>`,
12
+ "index.jsx": `import React from 'react';
13
+ import ReactDOM from 'react-dom/client';
14
+ import Counter from './Counter.jsx';
15
+
16
+ ReactDOM.createRoot(document.getElementById('root')).render(
17
+ <React.StrictMode>
18
+ <Counter />
19
+ </React.StrictMode>
20
+ );`,
21
+ "Counter.jsx": `import React, { useState, useEffect } from 'react';
22
+
23
+ function Counter() {
24
+ const [count, setCount] = useState(0);
25
+
26
+ useEffect(() => {
27
+ console.log('React Hooks working: count is ' + count);
28
+ }, [count]);
29
+
30
+ return (
31
+ <div>
32
+ <p>You clicked {count} times</p>
33
+ <button onClick={() => setCount(count + 1)}>
34
+ Click me
35
+ </button>
36
+ </div>
37
+ );
38
+ }
39
+
40
+ export default Counter;`,
41
+ "package.json": `{
42
+ "dependencies": {
43
+ "react": "^18.2.0",
44
+ "react-dom": "^18.2.0"
45
+ }
46
+ }`,
47
+ };
@@ -0,0 +1,6 @@
1
+ export declare const reactJsx: {
2
+ "index.html": string;
3
+ "index.jsx": string;
4
+ "App.jsx": string;
5
+ "package.json": string;
6
+ };
@@ -0,0 +1,34 @@
1
+ export const reactJsx = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>React JSX Test</title>
6
+ </head>
7
+ <body>
8
+ <div id="root"></div>
9
+ <script type="module" src="index.jsx"></script>
10
+ </body>
11
+ </html>`,
12
+ "index.jsx": `import React from 'react';
13
+ import ReactDOM from 'react-dom/client';
14
+ import App from './App.jsx';
15
+
16
+ ReactDOM.createRoot(document.getElementById('root')).render(
17
+ <React.StrictMode>
18
+ <App />
19
+ </React.StrictMode>
20
+ );`,
21
+ "App.jsx": `import React from 'react';
22
+
23
+ function App() {
24
+ return <div>Hello React JSX!</div>;
25
+ }
26
+
27
+ export default App;`,
28
+ "package.json": `{
29
+ "dependencies": {
30
+ "react": "^18.2.0",
31
+ "react-dom": "^18.2.0"
32
+ }
33
+ }`,
34
+ };
@@ -0,0 +1,4 @@
1
+ export declare const threeJsUsage: {
2
+ "index.html": string;
3
+ "index.js": string;
4
+ };
@@ -0,0 +1,24 @@
1
+ export const threeJsUsage = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>Three.js Test</title>
6
+ <script type="importmap">
7
+ {
8
+ "imports": {
9
+ "three": "https://cdn.jsdelivr.net/npm/three@0.175.0/build/three.module.js",
10
+ "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.175.0/examples/jsm/"
11
+ }
12
+ }
13
+ </script>
14
+ </head>
15
+ <body>
16
+ <script type="module" src="index.js"></script>
17
+ </body>
18
+ </html>`,
19
+ "index.js": `
20
+ import * as THREE from 'three';
21
+ import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
22
+ console.log('Three.js imports:', typeof THREE, typeof OrbitControls);
23
+ `,
24
+ };
@@ -0,0 +1,5 @@
1
+ export declare const typeScriptSupport: {
2
+ "index.html": string;
3
+ "index.ts": string;
4
+ "person.ts": string;
5
+ };
@@ -0,0 +1,29 @@
1
+ export const typeScriptSupport = {
2
+ "index.html": `<!DOCTYPE html>
3
+ <html>
4
+ <head>
5
+ <title>TypeScript Test</title>
6
+ </head>
7
+ <body>
8
+ <div id="app"></div>
9
+ <script type="module" src="index.ts"></script>
10
+ </body>
11
+ </html>`,
12
+ "index.ts": `import { Person } from './person';
13
+
14
+ const person: Person = {
15
+ name: 'John Doe',
16
+ age: 30
17
+ };
18
+
19
+ document.getElementById('app')!.innerHTML = \`
20
+ <h1>Hello, \${person.name}!</h1>
21
+ <p>You are \${person.age} years old.</p>
22
+ \`;
23
+
24
+ console.log('TypeScript is working');`,
25
+ "person.ts": `export interface Person {
26
+ name: string;
27
+ age: number;
28
+ }`,
29
+ };
@@ -0,0 +1,2 @@
1
+ import { VizFiles } from "@vizhub/viz-types";
2
+ export declare const xmlTest: VizFiles;
@@ -0,0 +1,26 @@
1
+ import { generateVizFileId } from "@vizhub/viz-types";
2
+ export const xmlTest = {
3
+ [generateVizFileId()]: {
4
+ name: "index.html",
5
+ text: `<!DOCTYPE html>
6
+ <html>
7
+ <body>
8
+ <script>
9
+ const xhr = new XMLHttpRequest();
10
+ xhr.open('GET', 'data.xml');
11
+ xhr.onload = () => {
12
+ console.log(xhr.responseXML.documentElement.nodeName);
13
+ };
14
+ xhr.send();
15
+ </script>
16
+ </body>
17
+ </html>`,
18
+ },
19
+ [generateVizFileId()]: {
20
+ name: "data.xml",
21
+ text: `<?xml version="1.0" encoding="UTF-8"?>
22
+ <root>
23
+ <item>Test</item>
24
+ </root>`,
25
+ },
26
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,40 @@
1
+ import puppeteer from "puppeteer";
2
+ import { describe, it, expect, beforeAll, afterAll } from "vitest";
3
+ import { computeSrcDoc } from "../index";
4
+ import { testInBrowser } from "./testInBrowser";
5
+ import { basicHTML, fetchProxy, jsScriptTag, styleTest, xmlTest, protocolTest, } from "./fixtures/magicSandbox";
6
+ let browser;
7
+ beforeAll(async () => {
8
+ browser = await puppeteer.launch();
9
+ });
10
+ afterAll(async () => {
11
+ await browser.close();
12
+ });
13
+ describe("Magic Sandbox", () => {
14
+ it("should generate srcdoc HTML", () => {
15
+ const srcdoc = computeSrcDoc(basicHTML);
16
+ expect(srcdoc).toContain("<!DOCTYPE html>");
17
+ expect(srcdoc).toContain("<title>My HTML Document</title>");
18
+ expect(srcdoc).toContain("Hello, World!");
19
+ });
20
+ it("basicHTML", async () => {
21
+ await testInBrowser(browser, basicHTML, "Hello, World!");
22
+ });
23
+ it("jsScriptTag", async () => {
24
+ await testInBrowser(browser, jsScriptTag, "Hello, JS!");
25
+ });
26
+ it("fetchProxy", async () => {
27
+ await testInBrowser(browser, fetchProxy, "Hello, Fetch!");
28
+ });
29
+ it("should handle CSS file loading", async () => {
30
+ await testInBrowser(browser, styleTest, "rgb(255, 0, 0)");
31
+ });
32
+ it("should handle XML file loading", async () => {
33
+ await testInBrowser(browser, xmlTest, "root");
34
+ });
35
+ it("should convert protocol-less URLs to https", () => {
36
+ const srcdoc = computeSrcDoc(protocolTest);
37
+ expect(srcdoc).toContain('href="https://fonts.googleapis.com');
38
+ expect(srcdoc).toContain('src="https://code.jquery.com');
39
+ });
40
+ });
@@ -0,0 +1,15 @@
1
+ import { Browser, Page } from "puppeteer";
2
+ import { VizCache } from "../v3/vizCache";
3
+ import { FileCollection, VizId } from "@vizhub/viz-types";
4
+ import { SlugCache } from "../v3/slugCache";
5
+ import { SvelteCompiler } from "../v3/transformSvelte";
6
+ export declare function testInBrowser({ browser, files, vizCache, slugCache, vizId, expectedLog, evaluateInBrowser, getSvelteCompiler, }: {
7
+ browser: Browser;
8
+ files?: FileCollection;
9
+ vizCache?: VizCache;
10
+ slugCache?: SlugCache;
11
+ vizId?: VizId;
12
+ expectedLog: string | RegExp;
13
+ evaluateInBrowser?: (page: Page) => Promise<any>;
14
+ getSvelteCompiler?: () => Promise<SvelteCompiler>;
15
+ }): Promise<void>;
@@ -0,0 +1,47 @@
1
+ import { rollup } from "rollup";
2
+ import { expect } from "vitest";
3
+ import { buildHTML } from "../index";
4
+ const DEBUG = false;
5
+ export async function testInBrowser({ browser, files, vizCache, slugCache, vizId, expectedLog, evaluateInBrowser, getSvelteCompiler, }) {
6
+ const page = await browser.newPage();
7
+ try {
8
+ // Capture console.log output
9
+ const logs = [];
10
+ page.on("console", (message) => logs.push(message.text()));
11
+ // Capture page errors
12
+ page.on("pageerror", (error) => {
13
+ console.error("[testInBrowser] pageerror:", error);
14
+ });
15
+ // Load the HTML
16
+ const html = await buildHTML({
17
+ files,
18
+ vizCache,
19
+ slugCache,
20
+ vizId,
21
+ rollup,
22
+ getSvelteCompiler,
23
+ });
24
+ await page.setContent(html);
25
+ // Wait a bit for scripts to execute
26
+ await new Promise((resolve) => setTimeout(resolve, 100));
27
+ DEBUG && console.log("[testInBrowser] html:", html);
28
+ DEBUG && console.log("[testInBrowser] logs:", logs);
29
+ // Check console output
30
+ if (typeof expectedLog === "string") {
31
+ expect(logs).toContain(expectedLog);
32
+ }
33
+ else {
34
+ // If it's a RegExp, find a log that matches
35
+ const matchingLog = logs.find((log) => expectedLog.test(log));
36
+ expect(matchingLog).toBeDefined();
37
+ }
38
+ // If evaluateInBrowser is provided, run it and expect the result to be truthy
39
+ if (evaluateInBrowser) {
40
+ const result = await evaluateInBrowser(page);
41
+ expect(result).toBeTruthy();
42
+ }
43
+ }
44
+ finally {
45
+ await page.close();
46
+ }
47
+ }
@@ -0,0 +1,9 @@
1
+ import { Browser } from "puppeteer";
2
+ import { FileCollection } from "@vizhub/viz-types";
3
+ interface TestStackTraceOptions {
4
+ browser: Browser;
5
+ files: FileCollection;
6
+ expectedLineNumber: number;
7
+ }
8
+ export declare function testStackTrace({ browser, files, expectedLineNumber, }: TestStackTraceOptions): Promise<void>;
9
+ export {};
@@ -0,0 +1,55 @@
1
+ import { rollup } from "rollup";
2
+ import { expect } from "vitest";
3
+ import { buildHTML } from "../index";
4
+ const DEBUG = false;
5
+ // Invokes Puppeteer to test the HTML in a browser,
6
+ // and isolates the console.log output to check against expectedLog.
7
+ // Captures stack trace from an error in the page and validates that sourcemaps are working
8
+ export async function testStackTrace({ browser, files, expectedLineNumber, }) {
9
+ const page = await browser.newPage();
10
+ let errorCaptured = false;
11
+ try {
12
+ // Enable sourcemaps for proper stack traces
13
+ const html = await buildHTML({
14
+ files,
15
+ rollup,
16
+ enableSourcemap: true,
17
+ });
18
+ // Capture page errors with their stack traces
19
+ page.on("pageerror", (error) => {
20
+ errorCaptured = true;
21
+ const stack = error.stack || "";
22
+ DEBUG &&
23
+ console.log("[testStackTrace] Error stack:", stack);
24
+ // Verify the error message contains the expected text
25
+ expect(error.message).toContain("Hello main!");
26
+ // Find any stack frame with a line number close to what we expect
27
+ // Different browsers format stack traces differently
28
+ const stackLines = stack.split("\n");
29
+ let foundExpectedLineNumber = false;
30
+ for (const line of stackLines) {
31
+ // Look for patterns like: at generateError (error.js:3:3) or at file:///path/bundle.js:20:3
32
+ const lineMatches = line.match(/:(\d+):/);
33
+ if (lineMatches && lineMatches[1]) {
34
+ const lineNumber = parseInt(lineMatches[1], 10);
35
+ DEBUG &&
36
+ console.log(`[testStackTrace] Found line number in stack: ${lineNumber}`);
37
+ // Check if this line number matches any of our expected line numbers
38
+ if (expectedLineNumber === lineNumber) {
39
+ foundExpectedLineNumber = true;
40
+ break;
41
+ }
42
+ }
43
+ }
44
+ expect(foundExpectedLineNumber, `Stack trace should contain expected line number(s): ${expectedLineNumber}`).toBe(true);
45
+ });
46
+ await page.setContent(html);
47
+ // Wait a bit for scripts to execute and error to be thrown
48
+ await new Promise((resolve) => setTimeout(resolve, 200));
49
+ // Verify that we actually captured an error
50
+ expect(errorCaptured, "An error should have been thrown").toBe(true);
51
+ }
52
+ finally {
53
+ await page.close();
54
+ }
55
+ }
@@ -0,0 +1 @@
1
+ export {};