add onErrored prop

Author: hartzis

README.md

@@ -45,6 +45,7 @@ Other properties can be used to customise the rendering.
 | type | enum | *optional* `image` or `audio` The type of initial captcha *(__defaults:__ image)*
 | tabindex | number | *optional* The tabindex on the element *(__default:__ 0)*
 | onExpired | func | *optional* callback when the challenge is expired and has to be redone by user. By default it will call the onChange with null to signify expired callback. |
+| onErrored | func | *optional* callback when the challenge errored, most likely due to network issues. |
 | stoken | string | *optional* set the stoken parameter, which allows the captcha to be used from different domains, see [reCAPTCHA secure-token] |
 | size | enum | *optional* `compact`, `normal` or `invisible`. This allows you to change the size or do an invisible captcha |
 | badge | enum | *optional* `bottomright`, `bottomleft` or `inline`. Positions reCAPTCHA badge. *Only for invisible reCAPTCHA* |

src/recaptcha.js

@@ -45,6 +45,9 @@ export default class ReCAPTCHA extends React.Component {
       this.props.onChange(null);
     }
   }
+  handleErrored() {
+    if (this.props.onErrored) this.props.onErrored();
+  }
 
   explicitRender() {
     if (this.props.grecaptcha && this.props.grecaptcha.render && this._widgetId === undefined) {
@@ -56,6 +59,7 @@ export default class ReCAPTCHA extends React.Component {
         type: this.props.type,
         tabindex: this.props.tabindex,
         "expired-callback": this.handleExpired,
+        "error-callback": this.handleErrored,
         size: this.props.size,
         stoken: this.props.stoken,
         badge: this.props.badge,
@@ -99,6 +103,7 @@ export default class ReCAPTCHA extends React.Component {
       type,
       tabindex,
       onExpired,
+      onErrored,
       size,
       stoken,
       grecaptcha,
@@ -119,6 +124,7 @@ ReCAPTCHA.propTypes = {
   type: PropTypes.oneOf(["image", "audio"]),
   tabindex: PropTypes.number,
   onExpired: PropTypes.func,
+  onErrored: PropTypes.func,
   size: PropTypes.oneOf(["compact", "normal", "invisible"]),
   stoken: PropTypes.string,
   badge: PropTypes.oneOf(["bottomright", "bottomleft", "inline"]),

test/recaptcha.spec.js

@@ -100,4 +100,7 @@ describe("ReCAPTCHA", () => {
     it("should call onChange with null when response is expired");
     it("should call onExpired when response is expired");
   });
+  describe.skip("Errored", () => {
+    it("should call onErrored when grecaptcha errored");
+  });
 });