Skip to content

Commit 009461f

Browse files
Add turnstile e2e testing tutorial for Turnstile (cloudflare#19415)
* add an e2e example * update wording * linter fixes * Apply suggestions from code review --------- Co-authored-by: Patricia Santa Ana <[email protected]>
1 parent 66c5840 commit 009461f

File tree

1 file changed

+128
-0
lines changed

1 file changed

+128
-0
lines changed
Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
---
2+
title: Exclude Turnstile from E2E tests
3+
pcx_content_type: tutorial
4+
updated: 2025-01-24
5+
difficulty: Intermediate
6+
content_type: 📝 Tutorial
7+
languages:
8+
- TypeScript
9+
tags:
10+
- Node.js
11+
sidebar:
12+
order: 6
13+
---
14+
15+
This tutorial explains how to handle Turnstile in your end-to-end (E2E) tests by using Turnstile's dedicated testing keys.
16+
17+
## Overview
18+
19+
When running E2E tests, you often want to bypass or simplify the Turnstile verification process. Cloudflare provides official test credentials that always pass verification, making them perfect for testing environments:
20+
21+
- Test sitekey: `1x00000000000000000000AA`
22+
- Test secret key: `1x0000000000000000000000000000000AA`
23+
24+
For more details, refer to the [testing documentation](/turnstile/troubleshooting/testing/).
25+
26+
:::caution
27+
28+
Never use test credentials in production. Always ensure:
29+
- Test credentials are only used in test environments.
30+
- Production credentials are properly protected.
31+
- Your deployment process prevents test credentials from reaching production.
32+
:::
33+
34+
## Implementation
35+
36+
The key to implementing test-environment detection is identifying test requests server-side. Here is a simple approach:
37+
38+
```typescript
39+
// Detect test environments using IP addresses or headers
40+
function isTestEnvironment(request) {
41+
const testIPs = ['127.0.0.1', '::1'];
42+
const isTestIP = testIPs.includes(request.ip);
43+
const hasTestHeader = request.headers['x-test-environment'] === 'secret-token';
44+
45+
return isTestIP || hasTestHeader;
46+
}
47+
48+
// Use the appropriate credentials based on the environment
49+
function getTurnstileCredentials(request) {
50+
if (isTestEnvironment(request)) {
51+
return {
52+
sitekey: '1x00000000000000000000AA',
53+
secretKey: '1x0000000000000000000000000000000AA'
54+
};
55+
}
56+
57+
return {
58+
sitekey: process.env.TURNSTILE_SITE_KEY,
59+
secretKey: process.env.TURNSTILE_SECRET_KEY
60+
};
61+
}
62+
```
63+
64+
## Server-side integration
65+
66+
When rendering your page, inject the appropriate sitekey based on the environment:
67+
68+
```typescript
69+
app.get('/your-form', (req, res) => {
70+
const { sitekey } = getTurnstileCredentials(req);
71+
res.render('form', { sitekey });
72+
});
73+
```
74+
75+
## Client-side integration
76+
77+
Your template can then use the injected sitekey:
78+
79+
```html
80+
<div class="turnstile" data-sitekey="<%= sitekey %>"></div>
81+
```
82+
83+
## Best practices
84+
85+
1. **Environment detection**
86+
- Use multiple factors to identify test environments (IP, headers, etc.).
87+
- Keep your test environment identifiers secure if you need to test from the public web.
88+
89+
2. **Credential management**
90+
- Store production credentials securely (for example, in environment variables).
91+
- Never commit credentials to version control.
92+
- Use different credentials for each environment.
93+
94+
3. **Deployment safety**
95+
- Add checks to prevent test credentials in production.
96+
- Include credential validation in your CI/CD pipeline.
97+
- Monitor for accidental test credential usage.
98+
99+
## Testing considerations
100+
101+
- Test credentials will always pass verification.
102+
- They are perfect for automated testing environments.
103+
- They help avoid rate limiting during testing.
104+
- They make tests more predictable and faster.
105+
106+
## Example test setup
107+
108+
For Cypress or similar E2E testing frameworks:
109+
110+
```typescript
111+
// Set test header for all test requests
112+
beforeEach(() => {
113+
cy.intercept('*', (req) => {
114+
req.headers['x-test-environment'] = 'secret-token';
115+
});
116+
});
117+
118+
// Your test can now interact with the form normally
119+
it('submits form successfully', () => {
120+
cy.visit('/your-form');
121+
cy.get('form').submit();
122+
// Turnstile will automatically pass verification
123+
});
124+
```
125+
126+
## Conclusion
127+
128+
By using Turnstile's test credentials and proper environment detection, you can create reliable E2E tests while maintaining security in production. Remember to always keep test credentials separate from production and implement proper safeguards in your deployment process.

0 commit comments

Comments
 (0)