Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DRAFT: Jl/1193 multichain example dapp #372

Draft
wants to merge 20 commits into
base: main
Choose a base branch
from

Conversation

jiexi
Copy link
Contributor

@jiexi jiexi commented Oct 31, 2024

Please don't review. This is more for storage, less for review. Not intending to merge these changes into this repo.

yarn start

Comment on lines +307 to +311
scopeContainer.innerHTML = `
<b>${scope}</b>
<br>
Block Number: ${value}
`;

Check warning

Code scanning / CodeQL

DOM text reinterpreted as HTML Medium

DOM text
is reinterpreted as HTML without escaping meta-characters.

Copilot Autofix AI about 1 month ago

To fix the problem, we need to ensure that any user-controlled input is properly sanitized or escaped before being inserted into the HTML. The best way to fix this issue is to use a text node or a safe method to insert text content into the DOM, which will automatically escape any potentially dangerous characters.

In this case, we can use textContent instead of innerHTML to safely insert the scope and value variables into the DOM. This will prevent any HTML or script injection.

Suggested changeset 1
src/multichain_index.html

Autofix patch

Autofix patch
Run the following command in your local git repository to apply this patch
cat << 'EOF' | git apply
diff --git a/src/multichain_index.html b/src/multichain_index.html
--- a/src/multichain_index.html
+++ b/src/multichain_index.html
@@ -323,7 +323,9 @@
 
-        scopeContainer.innerHTML = `
-                      <b>${scope}</b>
-                      <br>
-                      Block Number: ${value}
-                    `;
+        scopeContainer.innerHTML = '';
+        const scopeText = document.createElement('b');
+        scopeText.textContent = scope;
+        scopeContainer.appendChild(scopeText);
+        scopeContainer.appendChild(document.createElement('br'));
+        const blockNumberText = document.createTextNode(`Block Number: ${value}`);
+        scopeContainer.appendChild(blockNumberText);
         scopeContainer.style.border = "1px solid red";
EOF
@@ -323,7 +323,9 @@

scopeContainer.innerHTML = `
<b>${scope}</b>
<br>
Block Number: ${value}
`;
scopeContainer.innerHTML = '';
const scopeText = document.createElement('b');
scopeText.textContent = scope;
scopeContainer.appendChild(scopeText);
scopeContainer.appendChild(document.createElement('br'));
const blockNumberText = document.createTextNode(`Block Number: ${value}`);
scopeContainer.appendChild(blockNumberText);
scopeContainer.style.border = "1px solid red";
Copilot is powered by AI and may make mistakes. Always verify output.
Positive Feedback
Negative Feedback

Provide additional feedback

Please help us improve GitHub Copilot by sharing more details about this comment.

Please select one or more of the options
Copy link

socket-security bot commented Nov 1, 2024

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package New capabilities Transitives Size Publisher
npm/@ethereumjs/rlp@5.0.2 None 0 134 kB holgerd77
npm/@types/ws@8.5.3 None 0 20.8 kB types
npm/abitype@0.7.1 None 0 475 kB awkweb
npm/commander@7.2.0 filesystem, shell 0 145 kB abetomo
npm/d3-array@3.2.4 None 0 164 kB mbostock
npm/d3-axis@3.0.0 None 0 31.4 kB mbostock
npm/d3-brush@3.0.0 None 0 66.6 kB mbostock
npm/d3-chord@3.0.1 None 0 38.5 kB mbostock
npm/d3-color@3.1.0 None 0 61.2 kB mbostock
npm/d3-contour@4.0.2 None 0 49.3 kB mbostock
npm/d3-delaunay@6.0.4 None 0 104 kB mbostock
npm/d3-dsv@3.0.1 None 0 51.2 kB mbostock
npm/d3-ease@3.0.1 None 0 34.6 kB mbostock
npm/d3-fetch@3.0.1 network 0 16.4 kB mbostock
npm/d3-force@3.0.0 None 0 89.6 kB mbostock
npm/d3-format@3.1.0 None 0 57.8 kB mbostock
npm/d3-geo@3.1.1 None 0 227 kB mbostock
npm/d3-hierarchy@3.1.2 None 0 136 kB mbostock
npm/d3-polygon@3.0.1 None 0 14.8 kB mbostock
npm/d3-random@3.0.1 None 0 38.1 kB mbostock
npm/d3-scale-chromatic@3.1.0 None 0 75.7 kB mbostock
npm/d3-scale@4.0.2 None 0 174 kB mbostock
npm/d3-selection@3.0.0 None 0 135 kB mbostock
npm/d3-shape@3.2.0 None 0 247 kB mbostock
npm/d3-transition@3.0.1 None 0 111 kB mbostock
npm/d3-zoom@3.0.0 None 0 86.9 kB mbostock
npm/d3@7.9.0 None 0 871 kB mbostock
npm/delaunator@5.0.1 None 0 55.3 kB mourner
npm/internmap@2.0.3 None 0 10.5 kB mbostock
npm/isomorphic-ws@5.0.0 None 0 4.04 kB heineiuo
npm/robust-predicates@3.0.2 None 0 296 kB mourner
npm/rw@1.3.3 filesystem 0 24.2 kB mbostock
npm/setimmediate@1.0.5 None 0 8.56 kB domenic
npm/web3-core@4.7.0 None 0 486 kB gregthegreek, jdevcs, luu-alex, ...1 more
npm/web3-errors@1.3.0 None 0 416 kB gregthegreek, jdevcs, luu-alex, ...2 more
npm/web3-eth-accounts@4.2.1 None 0 1.36 MB luu-alex
npm/web3-eth-contract@4.7.0 None 0 436 kB gregthegreek, jdevcs, luu-alex, ...1 more
npm/web3-eth-iban@4.0.7 None 0 78.4 kB jdevcs
npm/web3-eth@4.10.0 None 0 1.34 MB gregthegreek, jdevcs, luu-alex, ...1 more
npm/web3-net@4.1.0 None 0 40.5 kB luu-alex
npm/web3-providers-http@4.2.0 None 0 27.5 kB gregthegreek, jdevcs, luu-alex, ...1 more
npm/web3-providers-ipc@4.0.7 filesystem, network 0 33 kB jdevcs
npm/web3-providers-ws@4.0.8 None 0 35.4 kB luu-alex
npm/web3-rpc-methods@1.3.0 None 0 135 kB luu-alex
npm/web3-validator@2.0.6 None 0 957 kB luu-alex
npm/ws@8.18.0 environment, network 0 147 kB lpinca
npm/zod@3.23.8 None 0 667 kB colinmcd94

View full report↗︎

Copy link

socket-security bot commented Nov 1, 2024

🚨 Potential security issues detected. Learn more about Socket for GitHub ↗︎

To accept the risk, merge this PR and you will not be notified again.

Alert Package NoteSourceCI
Network access npm/d3-fetch@3.0.1 🚫
Network access npm/web3-providers-ipc@4.0.7 🚫
Network access npm/web3-providers-ipc@4.0.7 🚫
New author npm/web3-net@4.1.0 🚫
New author npm/web3-providers-ws@4.0.8 🚫

View full report↗︎

Next steps

What is network access?

This module accesses the network.

Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use.

What is new author?

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights.

Take a deeper look at the dependency

Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support [AT] socket [DOT] dev.

Remove the package

If you happen to install a dependency that Socket reports as Known Malware you should immediately remove it and select a different dependency. For other alert types, you may may wish to investigate alternative packages or consider if there are other ways to mitigate the specific risk posed by the dependency.

Mark a package as acceptable risk

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of ecosystem/package-name@version specifiers. e.g. @SocketSecurity ignore npm/foo@1.0.0 or ignore all packages with @SocketSecurity ignore-all

  • @SocketSecurity ignore npm/d3-fetch@3.0.1
  • @SocketSecurity ignore npm/web3-providers-ipc@4.0.7
  • @SocketSecurity ignore npm/web3-net@4.1.0
  • @SocketSecurity ignore npm/web3-providers-ws@4.0.8

// Sepolia
"eip155:11155111": {
name: "Sepolia",
contractAddress: '0x2e2512fd69cba059DFf557cD6f683a3279402e91',
Copy link
Contributor Author

@jiexi jiexi Nov 1, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

note you will have to deploy your own dummy bridge contracts to each of these testnets as the withdraw method is locked to my wallet addresses for the currently deployed contracts listed in this constant. The solidity file is in this PR. Note that there is no actual bridging, just piggy bank contracts that mock the bridging flow that is:

  1. sending to originating chain bridge contract
  2. claiming on target chain bridge contract

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

BTW I used the online Remix IDE to compile and deploy. EVM version: Paris (because of Linea not supporting an opcode)


const ETH_VALUE_PRECISION = 4;

const USE_SUBSCRIPTIONS = true; // use false for polling
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

set this to false to use polling instead of eth_subscribe to trigger on chain data fetching.

funnily enough, using polling results in a more responsive dapp experience than using subscription on block heads to determine when to read the chain for new data. I think this is because eth subscriptions causes us to hit the RPC rate limit, where as just using a setTimeout poll is close enough and results in less rate limiting

Copy link
Contributor Author

@jiexi jiexi Nov 1, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screenshot 2024-11-01 at 2 03 20 PM

simple example multichain dapp to illustrate how chain switching friction is gone

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screenshot 2024-11-01 at 2 04 28 PM

simple example eip1193 dapp to illustrate chain switching friction

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screenshot 2024-11-01 at 2 05 56 PM

More complicated bridging demo dapp to highlight some of the features enabled by the Multichain API.

Note this code is garbage spaghetti nonsense because I don't know how to use d3 and relied on chatgpt to start the project which was probably a mistake. And then I just kept bandaging things on in an effort to finish this before I am OOO. So... sorry lol

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant