From d87ec82b5e6f88f6c3234bb16f5a769cccb3722f Mon Sep 17 00:00:00 2001 From: Joe Polny Date: Fri, 5 Jan 2024 09:42:19 -0500 Subject: [PATCH] working webpack --- tests/web/index.html | 13 +++++++++++ tests/web/index.ts | 43 +++++++++++++++++++++++++++++++++++-- tests/web/webpack.config.js | 11 ++++++++-- 3 files changed, 63 insertions(+), 4 deletions(-) create mode 100644 tests/web/index.html diff --git a/tests/web/index.html b/tests/web/index.html new file mode 100644 index 000000000..7087e90b3 --- /dev/null +++ b/tests/web/index.html @@ -0,0 +1,13 @@ + + + + + +

App Spec

+ Loading appspec... +

TEAL

+ Loading teal... + + + + \ No newline at end of file diff --git a/tests/web/index.ts b/tests/web/index.ts index 55388450f..bf54f1bd5 100644 --- a/tests/web/index.ts +++ b/tests/web/index.ts @@ -1,3 +1,6 @@ +import { Project } from 'ts-morph'; +import fetch from 'node-fetch'; +import { VERSION } from '../../src/version'; import Compiler from '../../src/lib/compiler'; const CALCULATOR = `import { Contract } from '../../src/lib/index'; @@ -49,10 +52,46 @@ class Calculator extends Contract { }`; async function main() { - const compiler = new Compiler(CALCULATOR, 'Calculator', { disableWarnings: true }); + // Step One: Create a ts-morph project with an in-memory file system + const project = new Project({ + // useInMemoryFileSystem must be true in a browser environment + useInMemoryFileSystem: true, + // TEALScript requires experimentalDecorators to be enabled + compilerOptions: { experimentalDecorators: true }, + }); + + // Step Two: Add the source to the project + const srcPath = 'examples/calculator/calculator.algo.ts'; + project.createSourceFile(srcPath, CALCULATOR); + + // Step Three: Add TEALScript files to the project + const libDir = 'src/lib'; + + const indexPath = `${libDir}/index.ts`; + const typesPath = 'types/global.d.ts'; + const contractPath = `${libDir}/contract.ts`; + const lsigPath = `${libDir}/lsig.ts`; + const compilerPath = `${libDir}/compiler.ts`; + + const promises = [indexPath, typesPath, contractPath, lsigPath, compilerPath].map(async (p) => { + const response = await fetch(`https://raw.githubusercontent.com/algorandfoundation/TEALScript/${VERSION}/${p}`); + const text = await response.text(); + project.createSourceFile(p, text); + }); + + await Promise.all(promises); + + const compiler = new Compiler({ + srcPath, + className: 'Calculator', + project, + cwd: '/', + }); await compiler.compile(); await compiler.algodCompile(); - await compiler.appSpec(); + + document.getElementById('teal').innerHTML = compiler.teal.approval.map((a) => a.teal).join('\n'); + document.getElementById('appspec').innerHTML = JSON.stringify(compiler.appSpec(), null, 2); } main(); diff --git a/tests/web/webpack.config.js b/tests/web/webpack.config.js index 5137d2b1a..ab3d99425 100644 --- a/tests/web/webpack.config.js +++ b/tests/web/webpack.config.js @@ -1,9 +1,10 @@ // Generated using webpack-cli https://github.com/webpack/webpack-cli const path = require('path'); +const webpack = require('webpack'); const config = { - entry: './tests/web/index.ts', + entry: path.resolve(__dirname, 'index.ts'), output: { path: path.resolve(__dirname, 'dist'), }, @@ -15,13 +16,19 @@ const config = { exclude: ['/node_modules/'], }, ], - noParse: [require.resolve('typescript/lib/typescript.js')], + noParse: [require.resolve('@ts-morph/common/dist/typescript.js')], }, + plugins: [ + new webpack.ProvidePlugin({ + Buffer: ['buffer', 'Buffer'], + }), + ], resolve: { extensions: ['.tsx', '.ts', '.jsx', '.js', '...'], fallback: { fs: false, path: require.resolve('path-browserify'), + buffer: require.resolve('buffer/'), }, }, };