Skip to content

Commit 5b8bf35

Browse files
forgetsoHughParry
forgetso
and
HughParry
authored
Fix explicit render in bundle demo (#629)
Co-authored-by: HughParry <90424587+HughParry@users.noreply.github.com>
1 parent a976e02 commit 5b8bf35

File tree

2 files changed

+44
-40
lines changed

2 files changed

+44
-40
lines changed

‎demos/client-bundle-example/src/index.html

Lines changed: 43 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,47 @@
11
<html>
2-
<head>
3-
<link href="//cdn.muicss.com/mui-0.10.3/css/mui.min.css" rel="stylesheet" type="text/css" />
4-
<title>Procaptcha demo: Simple page</title>
5-
<script src="procaptcha.bundle.js" async defer></script>
6-
</head>
7-
<body>
8-
<div class="mui-container">
9-
<form action="?" class="mui-form">
10-
<legend>Login</legend>
11-
<div class="mui-textfield mui-textfield--float-label">
12-
<label>Email Address</label>
13-
<input type="email" required />
14-
</div>
15-
<div class="mui-textfield mui-textfield--float-label">
16-
<label>Password</label>
17-
<input type="password" required />
18-
</div>
19-
<div id="procaptcha-container"></div>
20-
<!-- Dev sitekey -->
21-
<div
22-
class="procaptcha"
23-
data-theme="dark"
24-
data-sitekey="5HUBceb4Du6dvMA9BiwN5VzUrzUsX9Zp7z7nSR2cC1TCv5jg"
25-
></div>
26-
<input type="submit" class="mui-btn mui-btn--raised" />
27-
</form>
2+
<head>
3+
<link href="//cdn.muicss.com/mui-0.10.3/css/mui.min.css" rel="stylesheet" type="text/css"/>
4+
<title>Procaptcha demo: Simple page</title>
5+
<script id="procaptchaScript" src="procaptcha.bundle.js" async defer></script>
6+
</head>
7+
<body>
8+
<div class="mui-container">
9+
<form action="?" class="mui-form">
10+
<legend>Login</legend>
11+
<div class="mui-textfield mui-textfield--float-label">
12+
<label>Email Address</label>
13+
<input type="email" required/>
2814
</div>
29-
<script>
30-
// Define a callback function to be called when the CAPTCHA is verified
31-
window.onCaptchaVerified = function (output) {
32-
console.log('Captcha verified, output: ' + JSON.stringify(output))
33-
}
15+
<div class="mui-textfield mui-textfield--float-label">
16+
<label>Password</label>
17+
<input type="password" required/>
18+
</div>
19+
<div id="procaptcha-container"></div>
20+
<!-- Dev sitekey -->
21+
<div
22+
class="procaptcha"
23+
data-theme="light"
24+
data-sitekey="5HUBceb4Du6dvMA9BiwN5VzUrzUsX9Zp7z7nSR2cC1TCv5jg"
25+
></div>
26+
<input type="submit" class="mui-btn mui-btn--raised"/>
27+
</form>
28+
</div>
29+
<script>
30+
// A function that will call the render Procaptcha function when the procaptcha script has loaded
31+
document.getElementById('procaptchaScript').addEventListener('load', function () {
32+
33+
// Define a callback function to be called when the CAPTCHA is verified
34+
window.onCaptchaVerified = function (output) {
35+
console.log('Captcha verified, output: ' + JSON.stringify(output))
36+
}
3437

35-
// Render the CAPTCHA explicitly on a container with id "procaptcha-container"
36-
procaptcha.render('procaptcha-container', {
37-
siteKey: '5HUBceb4Du6dvMA9BiwN5VzUrzUsX9Zp7z7nSR2cC1TCv5jg',
38-
theme: 'dark',
39-
callback: 'onCaptchaVerified',
40-
})
41-
</script>
42-
</body>
38+
// Render the CAPTCHA explicitly on a container with id "procaptcha-container"
39+
window.procaptcha.render('procaptcha-container', {
40+
siteKey: '5HUBceb4Du6dvMA9BiwN5VzUrzUsX9Zp7z7nSR2cC1TCv5jg',
41+
theme: 'dark',
42+
callback: 'onCaptchaVerified',
43+
})
44+
})
45+
</script>
46+
</body>
4347
</html>

‎packages/procaptcha-bundle/src/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,7 @@ export const render = (elementId: string, renderOptions: ProcaptchaRenderOptions
163163
}
164164

165165
export default function ready(fn: () => void) {
166-
if (document && document.readyState != 'loading') {
166+
if (document && document.readyState !== 'loading') {
167167
console.log('document.readyState ready!')
168168
fn()
169169
} else {

0 commit comments

Comments
 (0)