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 InputGroup;

describe("InputGroup", function () {
  before(function (done) {
    initJSDOM()
      .then(() => import("../../../../source/components/form/input-group.mjs"))
      .then((m) => {
        InputGroup = m.InputGroup;
        done();
      })
      .catch((e) => done(e));
  });

  it("should create an input group element", function () {
    const inputGroup = document.createElement("monster-input-group");

    expect(inputGroup).to.be.instanceof(InputGroup);
  });

  it("should allow the input group to stretch within constrained controls", function () {
    const cssText = InputGroup.getCSSStyleSheet()
      .flatMap((styleSheet) => Array.from(styleSheet.cssRules))
      .map((rule) => rule.cssText)
      .join("\n");

    expect(cssText).to.contain("display: flex");
    expect(cssText).to.contain("box-sizing: border-box");
    expect(cssText).to.contain("height: 100%");
  });
});
