title: Uncaught (in promise) ReferenceError: Flex is not defined Aurelia
body: <p>I am using Aurelia CLI 1.0.2. I am trying to integrate Cybersource Flex web sdk.
  Flex is a class in 'https://flex.cybersource.com/cybersource/assets/microform/0.11/flex-microform.min.js' library!
  So far, I have created a test project with same code and it works there and correctly find the Flex class with same Aurelia version. It does not work in this Project code.
  But I keep getting the following error. Any ideas? I am new to aurelia. Thanks.</p>
  <p>The error:</p>
  <pre><code>Uncaught (in promise) ReferenceError: Flex is not defined
      at Payment.createFlex (payment.js:58:21)
      at Payment.attached (payment.js:47:10)
      at Controller.attached (aurelia-templating.js:3799:1)
      at View.attached (aurelia-templating.js:1807:1)
      at ViewSlot.attached (aurelia-templating.js:2170:1)
      at View.attached (aurelia-templating.js:1817:1)
      at ViewSlot.attached (aurelia-templating.js:2170:1)
      at aurelia-framework.js:217:1 
  </code></pre>
  <p>The code:</p>
  <pre><code>canActivate() {
      logger.debug('Payment canActivate', this);
      if (this.captureContext === 'null') {
        this.getRouterData();
        logger.debug('Payment already taken');
        return new Redirect('/confirmation');
      }
    }
  
    activate(params) {
      return this.getPageConfig();
    }
  
    attached() {
      this.createFlex();
      this.getRouterData();
    }
  
    createFlex() {
      let scriptElement = document.createElement('script');
      scriptElement.src = 'https://flex.cybersource.com/cybersource/assets/microform/0.11/flex-microform.min.js';
  //the script is correctly loaded onto the html with &lt;script&gt; tag
      document.head.appendChild(scriptElement);
      logger.info('Creating flex');
      let captureContext = sessionStorage.captureContext;
  
      this.flex = new Flex(captureContext); //THIS IS WHERE I GET ERROR
  ...}
  </code></pre>
  <p>UPDATE:
  Changed to the following and now I am getting:
  <code>Uncaught ReferenceError: Flex is not defined</code>
  new impl:</p>
  <pre><code>    let flexScript = document.createElement('script');
      flexScript.src = 'https://flex.cybersource.com/cybersource/assets/microform/0.11/flex-microform.min.js';
      document.head.appendChild(flexScript);
  
      flexScript.onload = () =&gt; {
        // alert('Script Loaded');
        let captureContext = sessionStorage.captureContext;
        this.flex = new Flex(captureContext);
        this.createFlex();
      };
  AND
  
          flexScript.onload = () =&gt; {
        let captureContext = sessionStorage.captureContext;
        this.flex = new Flex(captureContext)
          .then(() =&gt; {
            this.createFlex();
            logger.info('hola');
          })
        // this.createFlex();
      };
  
  </code></pre>