import React from "react";
import { shallow, configure } from "enzyme";
import Adapter from "enzyme-adapter-react-16";
configure({ adapter: new Adapter() });

import { LiquidGauge, renderLabel } from "../../app/src/components/LiquidGauge";

describe("LiquidGauge", () => {

	it("should render an empty span if no tags", () => {
		const wrapper = shallow(<LiquidGauge tag={undefined} />);
		expect(wrapper.find(".liquidgauge-no-tags")).toHaveLength(1);
	});

	describe("rendered LiquidGauge", () => {
		let wrapper;
		beforeEach(() => {
			wrapper = shallow(<LiquidGauge tag={{name: "tag", value: 95.0}} maxValue={100} units="LBS" label="Label" />);
		});

		it("should have a div with liquidfill class", () => {
			expect(wrapper.find(".liquidfill")).toHaveLength(1);
		});

		it("should show a LiquidFillGauge instance", () => {
			expect(wrapper.find("LiquidFillGauge")).toHaveLength(1);
		});
	});

	describe("renderLabel function", () => {
		let label;
		beforeEach(() => {
			label = renderLabel({height: 100.0, width: 100.0, percent: "units", textSize: 1, tag: {value: 101.0}}, 101.0);
		});

		it("should show the value", () => {
			expect(shallow(label).find(".value").text()).toMatch("101");
		});
	});

});