- Docker Desktop running
- Node.js 18+ and npm
- A Grateful merchant account at merchant.grateful.me
npm install
npm run buildnpx @wordpress/env startFirst run takes a few minutes to pull Docker images. Subsequent starts are fast.
| URL | Credentials |
|---|---|
| Site: http://localhost:8888 | — |
| Admin: http://localhost:8888/wp-admin | admin / password |
The plugin and WooCommerce are automatically installed and activated.
WooCommerce requires a store address and currency before it will process payments.
- Go to WooCommerce > Settings > General
- Set a store address (any address works for testing)
- Set Currency to
USD(or whichever currency your Grateful integration uses) - Click Save changes
- Log in to merchant.grateful.me
- Go to Settings > Integrations and create a new integration
- Type: Online
- Name: anything (e.g. "Local Test")
- Copy the API Key and Secret Key
- Go to WooCommerce > Settings > Payments
- Find Grateful - Stablecoins and click Manage
- Check Enable Grateful Payment
- Paste your API Key and Secret Key
- Copy the Notification URL shown on that page — you'll need it in the next step
- Click Save changes
The local environment runs at localhost:8888, which Grateful's servers can't reach directly. To receive webhooks you need a tunnel:
# Using ngrok (install from https://ngrok.com)
ngrok http 8888ngrok will give you a public URL like https://abc123.ngrok.io. Use it to build the notification URL:
https://abc123.ngrok.io/wc-api/grateful_payment
Paste this into your Grateful integration's Notification URL field and save.
If you don't set up a tunnel, the payment flow still works — orders will redirect back correctly — but the webhook won't fire and order status won't auto-update to "Processing". You can update it manually in WooCommerce > Orders.
- Go to Products > Add New
- Give it a name (e.g. "Test Product") and set a price (e.g.
10.00) - Click Publish
- Visit http://localhost:8888 and add the test product to your cart
- Go to Checkout
- Fill in billing details (any valid-looking data works)
- Select Grateful - Stablecoins as the payment method
- Click Place Order
You should be redirected to the Grateful payment page. Complete the payment there.
After payment:
- You'll be redirected back to the WooCommerce order confirmation page
- The order status in WooCommerce > Orders should update to Processing (via webhook) or remain Pending if no tunnel is configured
If you can't use ngrok, you can trigger the webhook manually with curl to verify the handler works:
# Replace 123 with your actual WooCommerce order ID
ORDER_ID=123
SECRET_KEY=your_secret_key_here
PAYLOAD='{"status":"completed","externalReferenceId":"'$ORDER_ID'"}'
SIGNATURE=$(echo -n "$PAYLOAD" | openssl dgst -sha256 -hmac "$SECRET_KEY" | awk '{print $2}')
curl -X POST http://localhost:8888/wc-api/grateful_payment \
-H "Content-Type: application/json" \
-H "X-Grateful-Signature: $SIGNATURE" \
-d "$PAYLOAD"Expected: HTTP 200 and the order status changes to Processing.
# Stop containers (preserves data)
npx @wordpress/env stop
# Restart
npx @wordpress/env start
# Full reset — wipes all data and reinstalls from scratch
npx @wordpress/env destroy
npx @wordpress/env startPlugin not appearing in WooCommerce > Payments
- Make sure
npm run buildhas been run — the block checkout script must exist atbuild/checkout.js - Check Plugins > Installed Plugins and confirm "Grateful" is active
- Check WooCommerce > Settings > General has a store address set
"Failed to create payment" error at checkout
- Verify your API key is correct in WooCommerce > Settings > Payments > Grateful
- Check WP debug log:
npx @wordpress/env run cli wp eval 'echo WP_CONTENT_DIR;'to find the log path, then look atwp-content/debug.log
Order stays in Pending after returning from Grateful
- This is expected if no webhook tunnel is set up — see step 4
- Manually update the order status in WooCommerce > Orders
Environment won't start
- Make sure Docker Desktop is running
- Try
npx @wordpress/env destroythennpx @wordpress/env startfor a clean slate