Building MetaMask into Brave
This article is outdated! Brave now ships with the option to install MetaMask!
Furthermore, the process for building a custom MetaMask has also now changed and is detailed here instead!
The remaining article is for historical interest mostly!
The Brave Browser doesn’t have an official extension store yet, but they have provided a guide to building your own copy of Brave with custom extensions, so in this article we’re going to focus on one thing: How to build MetaMask into Brave. It’s going to be technical, and probably not interesting to everyone!
You’ll need node.js 7 or later installed to start (Their guide says 6+, but I had my luck at 7+). Then, we’re going to clone Brave and install its dependencies (this can take a while):
git clone https://github.com/brave/browser-laptop.git
Then we’re going to enter Brave’s extensions folder, and use
chrome-ext-downloader to install MetaMask from the Chrome store using its extension id. You can verify the extension ID to be safe on the Chrome store.
npm install -g chrome-ext-downloader
Next you’re going to open the file
app/extensions.js in the
browser-laptop folder, and find these lines:
// Manually install the braveExtension and torrentExtension
loadExtension(config.braveExtensionId, getExtensionsPath('brave'), generateBraveManifest(), 'component')
Below them, paste these lines:
// Install MetaMask:
Now open two terminals. One is going to watch & reload for changes:
npm run watch. The other is going to start & launch your development browser:
Congrats, you should have Brave open now, and MetaMask already kinda works!
We have not done any custom Brave work yet, and Extensions are very new to Brave, so there’s some downsides, and rough edges. For one thing, we still need Brave to add an Extension inspector to even begin to debug these issues (issue on Github):
- When initiating a transaction, the transaction approval does not pop up automatically. (Github Issue)
- When a transaction is initiated, the number we label the badge with does not update. (Github Issue)
The Good News
Other than those issues, MetaMask seems to be working out of the box!
If you’re using Dapps where you know when they’re suggesting transactions, and don’t mind opening MetaMask manually, it seems to be mostly functional!
If you’d like to build yourself a local copy, follow the instructions here. Note this won’t benefit from auto-updates, so you’d be committing to re-pulling and re-building when you want updates.
We’ll be continuing to look at integration with Brave, because we think it’s a great browser, so keep your eyes peeled!