[Vuejs]-Vue Karma Mocha Unit Test undefined is not a constructor querySelector

Turns out before making any assertions, I needed to first use Vue.nextTick() followed by the assertions, and finished with done().

Source

badge.spec.js

import Vue from "vue";
import badge from "./badge";

describe('badge.vue', () => {

  /* Badges */
  it('has zero badges', () => {
    const vm = new Vue({
      el: document.createElement('div'),
      data: {
        content: {
          rapi: [
            {
              "badges": [],
            }
          ],
        },
      },
      components: {
        badge
      },
      template: '<badge :deal="content.rapi[0]" ></badge>',
    });
    Vue.nextTick(() => {
      expect(vm.$el.querySelector('.badge-copy')).to.equal(null);
      done();
    });
  });

  it('has a trending badge', () => {
    const vm = new Vue({
      el: document.createElement('div'),
      data: {
        content: {
          rapi: [
            {
              "badges": [
                {
                  "uuid": "84fbb816-3fec-4693-b0a6-ec2f9fb4e400",
                  "primaryColor": "#6650D7E6",
                  "text": "TRENDING",
                  "secondaryColor": "#FFFFFFFF",
                  "badgeType": "TRENDING"
                }
              ],
            },
          ],
        },
      },
      components: {
        badge
      },
      template: '<badge :deal="content.rapi[0]" ></badge>',
    });
    Vue.nextTick(() => {
      expect(vm.$el.querySelector('.badge')).to.not.equal(null);
      expect(vm.$el.querySelector('.badge-copy').innerText).to.equal('Trending');
      done();
    });
  });
});