r-util-js/packages/vue3/test/vue-helper.test.ts

import { describe, expect, it } from "vitest";
import {
  createCustomClassObj,
  convertCustomClass,
  mergeClass,
} from "../src/vue-helper";

// ========== createCustomClassObj ==========

describe("createCustomClassObj", () => {
  // ---------- 字符串输入 ----------
  it("应将单个类名字符串转为对象", () => {
    expect(createCustomClassObj("foo")).toEqual({ foo: true });
  });

  it("应将空格分隔的类名字符串转为对象", () => {
    expect(createCustomClassObj("foo bar")).toEqual({ foo: true, bar: true });
  });

  it("应处理前后有空格的字符串", () => {
    // trim 后 "foo  bar"，replace(" +"," ") 是字符串匹配不会替换连续空格
    // split(" ") 产生 ["foo", "", "bar"]，空字符串作为键
    expect(createCustomClassObj("  foo  bar  ")).toEqual({ foo: true, "": true, bar: true });
  });

  it("应处理多个连续空格", () => {
    // replace(" +", " ") 是字符串匹配而非正则，不会替换连续空格
    // split(" ") 产生 ["foo", "", "", "", "bar"]，重复的空字符串键只保留最后一个
    expect(createCustomClassObj("foo    bar")).toEqual({ foo: true, "": true, bar: true });
  });

  it("空字符串应返回空对象", () => {
    expect(createCustomClassObj("")).toEqual({});
  });

  it("仅空格的字符串应返回空对象", () => {
    expect(createCustomClassObj("   ")).toEqual({});
  });

  // ---------- 数组输入 ----------
  it("应将类名数组转为对象", () => {
    expect(createCustomClassObj(["foo", "bar"])).toEqual({ foo: true, bar: true });
  });

  it("应将单个元素的数组转为对象", () => {
    expect(createCustomClassObj(["foo"])).toEqual({ foo: true });
  });

  it("空数组应返回空对象", () => {
    expect(createCustomClassObj([])).toEqual({});
  });

  // ---------- 异常输入 ----------
  it("传入对象应抛出 TypeError", () => {
    expect(() => createCustomClassObj({} as any)).toThrow(TypeError);
  });

  it("传入数字应抛出 TypeError", () => {
    expect(() => createCustomClassObj(123 as any)).toThrow(TypeError);
  });

  it("传入 null 应抛出 TypeError", () => {
    expect(() => createCustomClassObj(null as any)).toThrow(TypeError);
  });

  it("传入 undefined 应抛出 TypeError", () => {
    expect(() => createCustomClassObj(undefined as any)).toThrow(TypeError);
  });
});

// ========== convertCustomClass ==========

describe("convertCustomClass", () => {
  // ---------- 字符串输入 ----------
  it("应将字符串转为类名对象", () => {
    expect(convertCustomClass("foo bar")).toEqual({ foo: true, bar: true });
  });

  it("应将单个类名字符串转为对象", () => {
    expect(convertCustomClass("foo")).toEqual({ foo: true });
  });

  it("空字符串应返回空对象", () => {
    expect(convertCustomClass("")).toEqual({});
  });

  // ---------- 数组输入 ----------
  it("应将类名数组转为对象", () => {
    expect(convertCustomClass(["foo", "bar"])).toEqual({ foo: true, bar: true });
  });

  it("空数组应返回空对象", () => {
    expect(convertCustomClass([])).toEqual({});
  });

  // ---------- 对象输入 ----------
  it("应直接返回对象", () => {
    const obj = { foo: true, bar: false };
    expect(convertCustomClass(obj)).toEqual(obj);
  });

  it("应保留对象中值为 false 的属性", () => {
    const obj = { foo: true, bar: false };
    const result = convertCustomClass(obj);
    expect(result).toHaveProperty("bar", false);
  });

  // ---------- 异常输入 ----------
  it("传入数字应抛出 TypeError", () => {
    expect(() => convertCustomClass(123 as any)).toThrow(TypeError);
  });

  it("传入 null 应抛出 TypeError", () => {
    expect(() => convertCustomClass(null as any)).toThrow(TypeError);
  });

  it("传入 undefined 应抛出 TypeError", () => {
    expect(() => convertCustomClass(undefined as any)).toThrow(TypeError);
  });

  it("传入布尔值应抛出 TypeError", () => {
    expect(() => convertCustomClass(true as any)).toThrow(TypeError);
  });
});

// ========== mergeClass ==========

describe("mergeClass", () => {
  it("应合并多个字符串类名", () => {
    expect(mergeClass("foo", "bar")).toEqual({ foo: true, bar: true });
  });

  it("应合并字符串和数组", () => {
    expect(mergeClass("foo", ["bar"])).toEqual({ foo: true, bar: true });
  });

  it("应合并字符串、数组和对象", () => {
    expect(mergeClass("foo", ["bar"], { baz: true })).toEqual({
      foo: true,
      bar: true,
      baz: true,
    });
  });

  it("后面的值应覆盖前面的同名属性", () => {
    expect(mergeClass({ foo: true }, { foo: false })).toEqual({ foo: false });
  });

  it("字符串形式的类名应覆盖前面的", () => {
    // "foo" → { foo: true }，后者覆盖前者
    expect(mergeClass("foo", "foo")).toEqual({ foo: true });
  });

  it("单个参数应正常工作", () => {
    expect(mergeClass("foo")).toEqual({ foo: true });
  });

  it("应处理空字符串参数", () => {
    expect(mergeClass("")).toEqual({});
  });

  it("应处理空数组参数", () => {
    expect(mergeClass([])).toEqual({});
  });

  it("应处理空对象参数", () => {
    expect(mergeClass({})).toEqual({});
  });

  it("应合并多个对象类名", () => {
    expect(
      mergeClass({ color: true }, { size: true }, { weight: true }),
    ).toEqual({ color: true, size: true, weight: true });
  });

  it("实际使用场景：Vue 组件中合并 class", () => {
    // 模拟组件内部 class + 传入 class
    const internal = "btn primary";
    const custom = { active: true, disabled: false };
    expect(mergeClass(internal, custom)).toEqual({
      btn: true,
      primary: true,
      active: true,
      disabled: false,
    });
  });
});