Connecting MetaMask wallet in Blockchain / Solidity - Step-by-Step Execution

Concept Flow - Connecting MetaMask wallet

User clicks Connect button

↓

Check if MetaMask is installed

↓

Request account access

↓

User approves or rejects

↓

Get account address

↓

Display connected account

This flow shows how a user connects their MetaMask wallet by clicking a button, the app checks MetaMask presence, requests access, and handles approval or rejection.

Execution Sample

Blockchain / Solidity

async function connectWallet() {
  if (!window.ethereum) {
    alert('MetaMask not installed');
    return;
  }
  try {
    const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
    console.log('Connected account:', accounts[0]);
  } catch (error) {
    console.error('User rejected the request or error occurred:', error);
  }
}

This code tries to connect to MetaMask and logs the first account if successful.

Execution Table

Step	Action	Check/Request	Result	Next Step
1	User clicks Connect button	N/A	Trigger connectWallet()	Check if MetaMask is installed
2	Check MetaMask presence	window.ethereum exists?	Yes	Request account access
3	Request account access	eth_requestAccounts method called	User approves	Get account address
4	Get account address	accounts array received	accounts[0] = '0xABC123...'	Display connected account
5	Display connected account	Console logs account	Output: Connected account: 0xABC123...	End

💡 Execution stops after displaying the connected account or if MetaMask is not installed or user rejects access.

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
window.ethereum	undefined or object	object (MetaMask present)	object	object	object
accounts	undefined	undefined	['0xABC123...']	['0xABC123...']	['0xABC123...']
accounts[0]	undefined	undefined	'0xABC123...'	'0xABC123...'	'0xABC123...'

Key Moments - 3 Insights

What happens if MetaMask is not installed?

At Step 2 in the execution_table, if window.ethereum is undefined, the code alerts the user to install MetaMask and stops further execution.

What if the user rejects the connection request?

At Step 3, if the user rejects, the promise from eth_requestAccounts is rejected and the code should handle this error (now shown in sample), preventing account retrieval.

Why do we use accounts[0]?

At Step 4, accounts is an array of addresses; accounts[0] is the first connected account, which is usually the active wallet address.

Visual Quiz - 3 Questions

Look at the execution_table, what is the result of Step 2?

A User rejects connection

B MetaMask is not installed

C MetaMask is installed (window.ethereum exists)

D Account address received

💡 Hint

Check the 'Result' column in Step 2 of the execution_table.

At which step does the user approve the connection?

A Step 1

B Step 3

C Step 2

D Step 4

💡 Hint

Look at the 'Next Step' and 'Result' columns in Step 3 of the execution_table.

If the user rejects the connection request, what should happen?

A The connection process stops without account access

B The app alerts to install MetaMask

C The account address is displayed

D The app automatically retries connection

💡 Hint

Refer to key_moments about user rejection and Step 3 in execution_table.

Concept Snapshot

Connecting MetaMask wallet:
- Check if window.ethereum exists (MetaMask installed)
- Request accounts with 'eth_requestAccounts'
- User approves or rejects connection
- On approval, get accounts array
- Use accounts[0] as connected wallet address

Full Transcript

This visual execution shows how a user connects their MetaMask wallet. First, the user clicks a connect button. The app checks if MetaMask is installed by looking for window.ethereum. If not found, it alerts the user to install MetaMask and stops. If MetaMask is present, the app requests account access using the 'eth_requestAccounts' method. The user can approve or reject this request. If approved, the app receives an array of accounts and uses the first account as the connected wallet address, displaying it. If rejected, the connection stops without access. Variables like window.ethereum and accounts change during these steps, reflecting the connection state.