Simple test helper for Vue tests

example.js

import { shallowMount } from "@vue/test-utils";
import App from "./App.vue";
import { expectSelect } from "../../../testHelpers.js";

describe("Sample", () => {
  it("will help verifying layouts", () => {
    const wrapper = shallowMount(App);
    
    expectSelect(wrapper, "table", {}, (table) => {
      expectSelect(table, "tr", {count: 5});
      expectSelect(table, "th", {text: "Header A"});
    });
    
    expectSelect(wrapper, {ref: "childComponent"}, {}, (child) => {
      expect(child.props('propA')).toBe(wrapper.vm.dataA);
    });
  });
});

testHelper.js

const expectSelect = (wrapper, selector, options, block) => {
	let selectorText = `'${selector}'`;
	let found = null;

	if (selector.ref) {
		selectorText = `ref: "${selector.ref}"`;
		found = wrapper.find(selector);
		if (options) {
			if (options.text && found.text() !== options.text) {
				found = wrapper.find("HACKFOREMPTYWRAPPER");
			}
			if (options.count === 0) {
				expect(found.exists()).withContext(`${found.length} unexpectedly found`).toBe(false);
			}
		} else {
			expect(found.exists()).withContext(`${selectorText}  not found`).toBe(true);
		}
		if(found.exists() && !!block && typeof(block) === "function") {
			block(found);
		};
		return found;
	}

	found = wrapper.findAll(selector);

	if (options) {
		if (options.text) {
			found = found.filter(wrapper => wrapper.text() === options.text);
			if(options.count !== 0) {
				expect(found.length).withContext(`${selectorText} with text '${options.text}' not found`).toBeGreaterThan(0);
				if (found.length === 0) {
					return found;
				}
			}
		}
		if (options.count) {
			expect(found.length).withContext(`${found.length} ${selectorText} found`).toEqual(options.count);
		}
	} else {
		expect(found.length).withContext(`${selectorText} not found`).toBeGreaterThan(0);
	}

	if(block && typeof(block) === "function") {
		if(found.length > 1) {
			expect(true).withContext(`Cannot have block with multiple matches (found: ${found.length})`).toBe(true);
		}
		block(found.at(0));
	}
	return found;
};

const selectedOptionText = (wrapper) => {
	if (wrapper.element.selectedIndex < 0) {
		return "";
	}
	return wrapper.element.options[wrapper.element.selectedIndex].text;
};

export { expectSelect, selectedOptionText };