DRAFT: Jl/1193 multichain example dapp #372
Conversation
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
| scopeContainer.innerHTML = ` | ||
| <b>${scope}</b> | ||
| <br> | ||
| Block Number: ${value} | ||
| `; |
Check warning
Code scanning / CodeQL
DOM text reinterpreted as HTML Medium
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix AI 12 days 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.
| @@ -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"; |
|
🚨 Potential security issues detected. Learn more about Socket for GitHub ↗︎ To accept the risk, merge this PR and you will not be notified again.
Next stepsWhat 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 dependencyTake 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 packageIf 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 riskTo ignore an alert, reply with a comment starting with
|
| // Sepolia | ||
| "eip155:11155111": { | ||
| name: "Sepolia", | ||
| contractAddress: '0x2e2512fd69cba059DFf557cD6f683a3279402e91', |
There was a problem hiding this comment.
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:
- sending to originating chain bridge contract
- claiming on target chain bridge contract
There was a problem hiding this comment.
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 |
There was a problem hiding this comment.
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
There was a problem hiding this comment.
simple example multichain dapp to illustrate how chain switching friction is gone
There was a problem hiding this comment.
simple example eip1193 dapp to illustrate chain switching friction
There was a problem hiding this comment.
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
Please don't review. This is more for storage, less for review. Not intending to merge these changes into this repo.
yarn start