fix test for aqua-ipfs-integration web

aqua-examples/aqua-ipfs-integration/aqua/package.json

@@ -22,7 +22,7 @@
   "license": "MIT",
   "dependencies": {
     "@fluencelabs/aqua-ipfs": "0.5.2",
-    "@fluencelabs/fluence": "0.19.1",
+    "@fluencelabs/fluence": "0.19.2",
     "@fluencelabs/fluence-network-environment": "1.0.13",
     "ipfs-http-client": "^50.1.2",
     "it-all": "^1.0.5",
@@ -30,7 +30,7 @@
     "uint8arrays": "^2.1.5"
   },
   "devDependencies": {
-    "@fluencelabs/aqua": "^0.6.0-275",
+    "@fluencelabs/aqua": "^0.6.1-279",
     "@fluencelabs/aqua-lib": "^0.4.0",
     "typescript": "^4.5.5"
   }

aqua-examples/aqua-ipfs-integration/nodejs/package.json

@@ -25,7 +25,7 @@
     "license": "MIT",
     "dependencies": {
         "@fluencelabs/ipfs-execution-aqua": "file:../aqua",
-        "@fluencelabs/fluence": "0.19.1",
+        "@fluencelabs/fluence": "0.19.2",
         "@fluencelabs/fluence-network-environment": "1.0.13",
         "@fluencelabs/aqua-lib": "0.4.0",
         "@fluencelabs/aqua-ipfs": "0.5.2",
@@ -35,7 +35,7 @@
         "multiaddr": "^10.0.0"
     },
     "devDependencies": {
-        "@fluencelabs/aqua": "^0.6.0-275",
+        "@fluencelabs/aqua": "^0.6.1-279",
         "@fluencelabs/aqua-lib": "^0.4.0",
         "typescript": "^4.5.5",
         "ts-node": "^10.2.1",

aqua-examples/aqua-ipfs-integration/package.json

@@ -9,7 +9,8 @@
         "build": "check-node-version --npm '>= 7' && npm run build -w aqua -w nodejs -w web"
     },
     "dependencies": {
-        "@fluencelabs/fluence": "0.19.1",
+        "@fluencelabs/aqua": "^0.6.1-279",
+        "@fluencelabs/fluence": "0.19.2",
         "typescript": "^4.4.4"
     },
     "engines": {
@@ -17,7 +18,7 @@
         "node": ">=15.0.0"
     },
     "devDependencies": {
-        "check-node-version": "^4.2.1",
+        "@fluencelabs/avm": "0.20.3",
-        "@fluencelabs/avm": "0.20.3"
+        "check-node-version": "^4.2.1"
     }
 }

aqua-examples/aqua-ipfs-integration/web/aqua/exports.aqua

@@ -1,5 +0,0 @@
-module Exports
-
-import "@fluencelabs/aqua-ipfs/ipfs-api.aqua"
-
-export set_timeout, get_external_swarm_multiaddr, get_external_api_multiaddr

aqua-examples/aqua-ipfs-integration/web/aqua/process.aqua

@@ -1,78 +0,0 @@
-import "@fluencelabs/aqua-lib/builtin.aqua"
-import "@fluencelabs/aqua-ipfs/ipfs.aqua"
-import "process_files.aqua"
-
-alias PeerId : string
-alias CID : string
-alias Multiaddr : string
-alias Hash : string
-alias ServiceID : string
-
-service StringOp("op"):
-    -- function that wraps string in array
-    array(s: string) -> []string
-
--- Add module to node
-func add_module(name: string, path: string) -> Hash:
-    config <- Dist.default_module_config(name)
-    module_hash <- Dist.add_module_from_vault(path, config)
-    <- module_hash
-
--- Add service blueprint to node
-func add_blueprint(module_hash: Hash) -> string:
-    prefixed_hash <- Op.concat_strings("hash:", module_hash)
-    dependencies <- StringOp.array(prefixed_hash)
-    blueprint <- Dist.make_blueprint("process_files", dependencies)
-    blueprint_id <- Dist.add_blueprint(blueprint)
-    <- blueprint_id
-
--- Download single .wasm module from IPFS and create a service from it
-func deploy_service(relay: PeerId, cid: CID, ipfs: Multiaddr, error: string, string -> ()) -> ?ServiceID:
-    service_id: *ServiceID
-    on relay:
-        -- Download .wasm from IPFS to node
-        get_result <- Ipfs.get_from(cid, ipfs)        
-        if get_result.success:
-            module_hash <- add_module("process_files", get_result.path)
-            blueprint_id <- add_blueprint(module_hash)
-            service_id <- Srv.create(blueprint_id)
-        else:
-            co error("Ipfs.get_from failed", get_result.error)
-    
-    <- service_id
-
--- Download file from IPFS, and write it's size to file in IPFS
-func put_file_size(
-    relay: PeerId, 
-    cid: CID, 
-    ipfs: Multiaddr, 
-    service_id: ServiceID, 
-    logSize: u32 -> (),
-    error: string, string -> ()
-) -> ?IpfsPutResult:
-    result: *IpfsPutResult
-    ProcessFiles service_id
-    on relay:
-        get <- Ipfs.get_from(cid, ipfs)
-        if get.success:
-            size <- ProcessFiles.file_size(get.path)
-            if size.success:
-                -- report file size in background
-                co logSize(size.size)
-                -- write file size to disk
-                write <- ProcessFiles.write_file_size(size.size)
-                if write.success:
-                    -- upload file to ipfs
-                    result <- Ipfs.put(write.path)
-                else:
-                    co error("ProcessFiles.write_file_size failed", write.error)
-            else:
-                co error("ProcessFiles.file_size failed", size.error)
-        else:
-            co error("Ipfs.get_from failed", get.error)
-    <- result
-
-func remove_service(relay: PeerId, service_id: ServiceID) -> bool:
-    on relay:
-        Srv.remove(service_id)
-    <- true

aqua-examples/aqua-ipfs-integration/web/aqua/process_files.aqua

@@ -1,15 +0,0 @@
-module ProcessFiles declares *
-
-data SizeResult:
-  size: u32
-  success: bool
-  error: string
-
-data WriteResult:
-  path: string
-  success: bool
-  error: string
-
-service ProcessFiles:
-  file_size(file_path: string) -> SizeResult
-  write_file_size(size: u32) -> WriteResult

aqua-examples/aqua-ipfs-integration/web/jest.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+    preset: 'jest-puppeteer',
+    testMatch: ['**/?(*.)+(spec|test).[t]s'],
+    testPathIgnorePatterns: ['/node_modules/', 'dist'],
+    transform: {
+        '^.+\\.ts?$': 'ts-jest',
+    },
+};

aqua-examples/aqua-ipfs-integration/web/package.json

@@ -4,12 +4,12 @@
     "private": true,
     "dependencies": {
         "@fluencelabs/ipfs-execution-aqua": "file:../aqua",
-        "@fluencelabs/fluence": "0.19.1",
+        "@fluencelabs/fluence": "0.19.2",
         "@fluencelabs/fluence-network-environment": "1.0.13",
         "@testing-library/jest-dom": "^5.14.1",
         "@testing-library/react": "^11.2.7",
         "@testing-library/user-event": "^12.8.3",
-        "@types/jest": "^26.0.24",
+        "@types/jest": "^27.4.0",
         "@types/node": "^12.20.16",
         "@types/react": "^17.0.14",
         "@types/react-dom": "^17.0.9",
@@ -17,7 +17,7 @@
         "multiaddr": "^10.0.0",
         "react": "^17.0.2",
         "react-dom": "^17.0.2",
-        "react-scripts": "4.0.3",
+        "react-scripts": "^5.0.0",
         "recoil": "^0.3.1",
         "typescript": "^4.3.5",
         "web-vitals": "^1.1.2"
@@ -26,7 +26,8 @@
         "postinstall": "copy-avm-public public",
         "start": "react-scripts start",
         "build": "react-scripts build",
-        "test": "react-scripts test",
+        "test": "jest --config=jest.config.js",
+        "_test": "react-scripts test",
         "eject": "react-scripts eject"
     },
     "eslintConfig": {
@@ -39,7 +40,9 @@
         "production": [
             ">0.2%",
             "not dead",
-            "not op_mini all"
+            "not op_mini all",
+            "not ie 11",
+            "not android 4.4.3-4.4.4"
         ],
         "development": [
             "last 1 chrome version",
@@ -48,7 +51,13 @@
         ]
     },
     "devDependencies": {
+        "@types/serve-handler": "^6.1.1",
+        "@types/jest-environment-puppeteer": "^4.4.1",
+        "@types/puppeteer": "^5.4.4",
         "node-sass": "^6.0.1",
-        "@fluencelabs/aqua-lib": "^0.4.0"
+        "@fluencelabs/aqua-lib": "^0.4.0",
+        "jest-puppeteer": "^6.0.2",
+        "serve": "^13.0.2",
+        "ts-jest": "^27.1.3"
     }
 }

aqua-examples/aqua-ipfs-integration/web/src/App.scss

@@ -137,7 +137,7 @@ table {
   }
 }
 
-.input-ro {
+.input-readonly {
   display: inline;
   width: 500px;
   height: 26px;

aqua-examples/aqua-ipfs-integration/web/src/Components/ConnectionForm.tsx

@@ -11,7 +11,7 @@ export const ConnectionForm = () => {
         {relayNodes.map((x) => (
           <li key={x.peerId}>
             <span className="mono">{x.peerId}</span>
-            <button className="btn" onClick={() => connect(x.multiaddr)}>
+            <button className="btn btn-connect" onClick={() => connect(x.multiaddr)}>
               Connect
             </button>
           </li>

aqua-examples/aqua-ipfs-integration/web/src/Components/IpfsForm.tsx

@@ -31,7 +31,7 @@ export const IpfsForm = () => {
         setValue={setWasm}
       />
       <div className="row">
-        <button className="btn btn-right" onClick={deployService}>
+        <button id="deploy-service" className="btn btn-right" onClick={deployService}>
           deploy service
         </button>
       </div>

aqua-examples/aqua-ipfs-integration/web/src/Components/SizeCalcForm.tsx

@@ -28,7 +28,7 @@ export const SizeCalcForm = () => {
       <TextInput text={"IPFS CID"} value={fileCID} setValue={setFileCID} />
 
       <div className="row">
-        <button className="btn btn-right" onClick={getFileSize}>
+        <button id="get-size" className="btn btn-right" onClick={getFileSize}>
           get size
         </button>
       </div>

aqua-examples/aqua-ipfs-integration/web/src/Components/SizeCalcResult.tsx

@@ -16,7 +16,7 @@ export const SizeCalcResult = () => {
           CID
         </p>
       </div>
-      <TextWithLabel text="File size:" value={fileSize} />
+      <TextWithLabel id="file-size" text="File size:" value={fileSize} />
       <TextWithLabel text="File size IPFS CID:" value={fileSizeCID} />
     </>
   );

aqua-examples/aqua-ipfs-integration/web/src/Components/TextInput.tsx

@@ -21,12 +21,15 @@ export const TextInput = (props: {
 
 export const TextWithLabel = (props: {
   text: string;
+  id?: string;
   value: string | null;
 }) => {
+  const idAttr = props.id ? { id: props.id } : {}
+  const attrs = { className: "input-readonly", ...idAttr };
   return (
     <div className="row">
       <label className="label bold">{props.text}</label>
-      <div className="input-ro">{props.value || ""}</div>
+      <div {...attrs}>{props.value || ""}</div>
     </div>
   );
 };

aqua-examples/aqua-ipfs-integration/web/src/__test__/test.spec.ts

@@ -0,0 +1,64 @@
+import handler from 'serve-handler';
+import http from 'http';
+import path from 'path';
+
+const port = 3001;
+const uri = `http://localhost:${port}/`
+const publicPath = path.join(__dirname, '../../build/');
+
+console.log(publicPath);
+
+const server = http.createServer((request, response) => {
+    return handler(request, response, {
+        public: publicPath
+  });
+})
+
+const startServer = async () => {
+    return new Promise((resolve: any) => {
+        server.listen(port, resolve);
+    })
+}
+
+const stopServer = async () => {
+    return new Promise((resolve: any) => {
+        server.close(resolve);
+    })
+}
+
+
+describe('smoke test', () => {
+    beforeAll(startServer);
+
+    afterAll(stopServer);
+
+    it('should work', async () => {
+        console.log('going to the page in browser...');
+        await page.goto(uri);
+
+        console.log('clicking connect button...');
+        await page.click('.btn-connect');
+    
+        console.log('waiting for fluence to connect...');
+        await page.waitForTimeout(1000);
+    
+        console.log('waiting for "deploy service" button to appear...');
+        await page.waitForSelector('#deploy-service');
+
+        console.log('clicking "deploy service" button...');
+        await page.click('#deploy-service');
+
+        console.log('waiting for "get size" button to appear...');
+        await page.waitForSelector('#get-size');
+
+        console.log('clicking "get size" button...');
+        await page.click('#get-size');
+
+        console.log('waiting for result to appear...');
+        const sizeEl = await page.waitForSelector('#file-size');
+        
+        const size = await sizeEl?.evaluate(x => x.textContent);
+
+        expect(size).toBe("144804");
+    }, 10000);
+});

fluence-js-examples/browser-example/src/__test__/test.spec.ts

@@ -16,7 +16,7 @@ const server = http.createServer((request, response) => {
 
 const startServer = async () => {
     return new Promise((resolve: any) => {
-        server.listen(3000, resolve);
+        server.listen(port, resolve);
     })
 }
 

quickstart/1-browser-to-browser/src/__test__/test.spec.ts

@@ -17,7 +17,7 @@ const server = http.createServer((request, response) => {
 
 const startServer = async () => {
     return new Promise((resolve: any) => {
-        server.listen(3000, resolve);
+        server.listen(port, resolve);
     })
 }
 

quickstart/3-browser-to-service/src/__test__/test.spec.ts

@@ -17,7 +17,7 @@ const server = http.createServer((request, response) => {
 
 const startServer = async () => {
     return new Promise((resolve: any) => {
-        server.listen(3000, resolve);
+        server.listen(port, resolve);
     })
 }