import { shallowMount } from "@vue/test-utils";
import { describe, expect, it, test } from "vitest";
import Header from "../src/ZHeader.vue";
import axiosHttp from "../../../utils/axiosHttp.js";

describe("Header.vue", () => {
  // 检查是否根据所传参数正确渲染出组件和子组件
  it("renders the header and its components correctly", () => {
    const wrapper = shallowMount(Header, {
      props: {
        logoImgUrl:
          "https://images.unsplash.com/photo-1516972810927-80185027ca84",
        welcomeTxt: "Hi,欢迎使用本系统",
        userInfo: {
          postName: "技术研发部",
          deptName: "金融科技中心",
          code: "ZZ00001",
          name: "张三",
        },
      },
    });
    expect(wrapper.find(".logo img").attributes("src")).toBe(
      "https://images.unsplash.com/photo-1516972810927-80185027ca84"
    );
    expect(wrapper.find(".title").text()).toEqual("Hi,欢迎使用本系统");
    expect(wrapper.find(".infoContainer li:nth-child(2)").text()).toEqual(
      "技术研发部"
    );
    expect(wrapper.find(".infoContainer li:nth-child(3)").text()).toEqual(
      "金融科技中心"
    );
    expect(wrapper.find(".infoContainer li:nth-child(4)").text()).toEqual(
      "ZZ00001"
    );
    expect(wrapper.find(".infoContainer li:nth-child(5)").text()).toEqual(
      "张三"
    );
  });
  // 测试 logOutDisabled 为 true 时，handleLogOut 事件是否被正确触发
  it("emits handleLogOut event when logOutDisabled is true", () => {
    const wrapper = shallowMount(Header, {
      props: {
        logOutDisabled: true,
        userInfo: {
          postName: "技术研发部",
          deptName: "金融科技中心",
          code: "ZZ00001",
          name: "张三",
        },
      },
    });
    wrapper.find(".infoContainer li:first-child a").trigger("click");
    expect(wrapper.emitted("handleLogOut")).toBeTruthy();
  });
});
