import * as chai from "chai";
import { chaiDom } from "../../../util/chai-dom.mjs";
import { initJSDOM } from "../../../util/jsdom.mjs";

let expect = chai.expect;
chai.use(chaiDom);

let ContextError;

describe("ContextError", function () {
	before(function (done) {
		initJSDOM()
			.then(() => {
				return import("../../../../source/components/form/context-error.mjs");
			})
			.then((m) => {
				ContextError = m["ContextError"];
				done();
			})
			.catch((e) => done(e));
	});

	afterEach(() => {
		let mocks = document.getElementById("mocks");
		mocks.innerHTML = "";
	});

	it("should default to visible content overflow", function (done) {
		let mocks = document.getElementById("mocks");
		const error = document.createElement("monster-context-error");
		error.innerHTML = "<p>Error message</p>";
		mocks.appendChild(error);

		setTimeout(() => {
			try {
				expect(error).to.be.instanceof(ContextError);
				const content = error.shadowRoot.querySelector('[part="content"]');
				expect(error.getOption("popper.contentOverflow")).to.equal("visible");
				expect(content.getAttribute("data-monster-overflow-mode")).to.equal(
					"visible",
				);
				done();
			} catch (e) {
				done(e);
			}
		}, 0);
	});
});
