title: braintree into flutter web using JS got this error "options.selector or options.container must reference a valid DOM node"
body: <p>Trying to implement Braintree payment gateway into flutter web.
  Still no SDK for <strong>flutter web</strong> from Braintree. So trying to implement their javascript SDK.</p>
  
  <p>Here is my js file</p>
  
  <pre><code>function payment(auth){
      var button = document.querySelector('submit-button');
      console.log(auth);
      console.log(button);
      braintree.dropin.create({
        authorization: auth,
        container: 'dropin-container'
      }, function (createErr, instance) {
          console.log(createErr);
          console.log(instance);
           button.addEventListener('click', function () {
              instance.requestPaymentMethod(function (requestPaymentMethodErr, payload) {
                // Submit payload.nonce to your server
                return payload.nonce
              });
           });
      });
  }
  </code></pre>
  
  <p>Calling this js function from dart. Here is the complete dart code.</p>
  
  <pre><code>@JS()
  library my_script;
  
  import 'dart:html';
  import 'dart:js_util';
  
  import 'package:carbonbins/model/model.dart';
  import 'package:carbonbins/pages/navigation.gr.dart';
  import 'package:carbonbins/utils/image_helper.dart';
  import 'package:flutter/material.dart';
  import 'dart:ui' as ui;
  
  import 'package:js/js.dart';
  import 'package:js/js.dart' as js;
  
  @JS()
  external void initBraintree(auth);
  
  @JS()
  external String payment(auth);
  
  class PaymentPage extends StatefulWidget {
    final UserModel userModel;
  
    PaymentPage({@required this.userModel});
  
    @override
    _PaymentPageState createState() =&gt; _PaymentPageState();
  }
  
  class _PaymentPageState extends State&lt;PaymentPage&gt; {
  
    String auth = "sandbox_.....";
  
    void getButton() {
      var htmlL = """&lt;div id="checkout-message"&gt;&lt;/div&gt;
          &lt;div id="dropin-container"&gt;&lt;/div&gt;
      &lt;button id="submit-button"&gt;Submit payment&lt;/button&gt;""";
  
      // ignore: undefined_prefixed_name
      ui.platformViewRegistry.registerViewFactory(
          'payment-container',
          (int viewId) =&gt; DivElement()
            ..appendHtml(htmlL)
            ..style.border = 'none');
  
      print(HtmlElementView(
        viewType: "dropin-container",
      ));
    }
  
    void setupDropin() {
      print(auth);
      var status = payment(auth);
      print("Status: $status");
    }
  
    @override
    void initState() {
      getButton();
      setupDropin();
      super.initState();
    }
  
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: Container(
          width: MediaQuery.of(context).size.width,
          child: Column(
            children: &lt;Widget&gt;[
              SizedBox(
                height: 100,
              ),
              Container(
                width: 500.0,
                height: 300.0,
                child: HtmlElementView(
                  viewType: "payment-container",
                ),
              )
            ],
          ),
        ),
      );
    }
  </code></pre>
  
  <p>When I run this code, I see only the submit button in the screen. Got this error from web console, </p>
  
  <pre><code>"options.selector or options.container must reference a valid DOM node."
  </code></pre>
  
  <p>How can I integrate the Braintree payment into the <strong>flutter web</strong>?</p>
  
  <p>or any other international payment gateway that works in flutter web.</p>