Unable to find form with id: "credit-card-form"
<p>I'm trying to use Braintree in my GWT Application. </p>

<p>At the moment I'm loading a form first and get the client token from my server as the user hits this <em>OK</em> button.</p>

<p>This is how I setup braintree:</p>

<pre class="lang-java prettyprint-override"><code>private static native void setup(String domId, String serverToken) /*-{
    braintree.setup(
        serverToken,
        "custom",
        {
            id: domId
        });
}-*/;
</code></pre>

<p>This is the work done in my view:</p>

<pre class="lang-java prettyprint-override"><code>private final static String CREDIT_CARD_FORM_ID = "credit-card-form";

@Inject
PaymentMethodInfoView(Binder uiBinder) {

    this.initWidget(uiBinder.createAndBindUi(this));

    this.formCreditCard.getElement().setId(CREDIT_CARD_FORM_ID);
}

@Override
public void setupBraintree(String serverToken) {
    BraintreeClient.setupForm(CREDIT_CARD_FORM_ID, serverToken);
}
</code></pre>

<p>Here <code>setupBraintree()</code> is called <em>after</em> the user has entered the credit card data and has clicked okay. As you can see I'm setting the <code>id</code> attribute in the constructor of the view.</p>

<p>Still, for some reason I am getting:</p>

<pre><code>Uncaught Error: Unable to find form with id: "credit-card-form"
</code></pre>

<p>Any idea what the issue is?</p>

<hr>

<p>This is my current Braintree client wrapper. I make sure that the static function <code>load()</code> is getting called in my web application bootstrapper.</p>

<pre class="lang-java prettyprint-override"><code>public class BraintreeClient {

    private final static Logger LOGGER = Logger.getLogger(BraintreeClient.class.getName());

    private final static String BRAINTREE_JS_URL = "https://js.braintreegateway.com/js/braintree-2.27.0.min.js";

    private static JavaScriptObject braintreeJs;

    public static void load(OnSuccessCallback&lt;Void&gt; success, OnFailureCallback failure) {

        if(braintreeJs == null) {

            LOGGER.fine("Loading " + BRAINTREE_JS_URL);

            braintreeJs = ScriptInjector.fromUrl(BRAINTREE_JS_URL).setCallback(
                    new Callback&lt;Void, Exception&gt;() {
                        @Override
                        public void onFailure(Exception caught) {
                            failure.onFailure(caught);
                            braintreeJs = null;
                        }

                        @Override
                        public void onSuccess(Void result) {
                            success.onSuccess(result);
                        }
                    }).inject();
        }
    }

    public static void setupForm(String domId, String serverToken) {

        if(braintreeJs == null) {
            throw new RuntimeException("Braintree has not been loaded. Did you call BraintreeClient.load()?");
        }

        LOGGER.fine("Setting up form " + domId);
        setup(domId, serverToken);
    }

    private static native void setup(String domId, String serverToken) /*-{
        braintree.setup(
            serverToken,
            "custom",
            {
                id: domId
            });
    }-*/;

}
</code></pre>

<hr>

<p><a href="https://i.stack.imgur.com/Tsf1E.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Tsf1E.png" alt="enter image description here"></a></p>