import { describe, it, expect, beforeEach } from 'vitest';
import { activeState } from './active-state.js';
import { mountHost, connectTrait, resetDOM } from '../test-helpers.js';

describe('active-state', () => {
  beforeEach(resetDOM);

  it('toggles data-active-state-active on click', () => {
    const host = mountHost();
    connectTrait(activeState, host);
    expect(host.hasAttribute('data-active-state-active')).toBe(false);
    host.click();
    expect(host.hasAttribute('data-active-state-active')).toBe(true);
    host.click();
    expect(host.hasAttribute('data-active-state-active')).toBe(false);
  });

  it('disconnect removes the active attribute and stops listening', () => {
    const host = mountHost();
    const inst = connectTrait(activeState, host);
    host.click();
    expect(host.hasAttribute('data-active-state-active')).toBe(true);
    inst.disconnect(host);
    expect(host.hasAttribute('data-active-state-active')).toBe(false);
    host.click();
    expect(host.hasAttribute('data-active-state-active')).toBe(false);
  });
});
