chromium/third_party/google-closure-library/closure/goog/dom/classlist_test.js

/**
 * @license
 * Copyright The Closure Library Authors.
 * SPDX-License-Identifier: Apache-2.0
 */

/** @fileoverview Shared code for classlist_test.html. */

goog.module('goog.dom.classlist_test');
goog.setTestOnly();

const ExpectedFailures = goog.require('goog.testing.ExpectedFailures');
const TagName = goog.require('goog.dom.TagName');
const classlist = goog.require('goog.dom.classlist');
const dom = goog.require('goog.dom');
const testSuite = goog.require('goog.testing.testSuite');

let expectedFailures;

testSuite({
  setUpPage() {
    expectedFailures = new ExpectedFailures();
  },

  tearDown() {
    expectedFailures.handleTearDown();
  },

  testGet() {
    const el = dom.createElement(TagName.DIV);
    assertTrue(classlist.get(el).length == 0);
    el.className = 'C';
    assertElementsEquals(['C'], classlist.get(el));
    el.className = 'C D';
    assertElementsEquals(['C', 'D'], classlist.get(el));
    el.className = 'C\nD';
    assertElementsEquals(['C', 'D'], classlist.get(el));
    el.className = ' C ';
    assertElementsEquals(['C'], classlist.get(el));
  },

  testGetSvg() {
    const el = dom.createElement(TagName.SVG);
    assertTrue(classlist.get(el).length == 0);
    el.setAttribute('class', 'C');
    assertElementsEquals(['C'], classlist.get(el));
    el.setAttribute('class', 'C D');
    assertElementsEquals(['C', 'D'], classlist.get(el));
    el.setAttribute('class', 'C\nD');
    assertElementsEquals(['C', 'D'], classlist.get(el));
    el.setAttribute('class', ' C ');
    assertElementsEquals(['C'], classlist.get(el));
  },

  testContainsWithNewlines() {
    const el = dom.getElement('p1');
    assertTrue('Should have SOMECLASS', classlist.contains(el, 'SOMECLASS'));
    assertTrue(
        'Should also have OTHERCLASS', classlist.contains(el, 'OTHERCLASS'));
    assertFalse(
        'Should not have WEIRDCLASS', classlist.contains(el, 'WEIRDCLASS'));
  },

  testContainsCaseSensitive() {
    const el = dom.getElement('p2');
    assertFalse(
        'Should not have camelcase', classlist.contains(el, 'camelcase'));
    assertFalse(
        'Should not have CAMELCASE', classlist.contains(el, 'CAMELCASE'));
    assertTrue('Should have camelCase', classlist.contains(el, 'camelCase'));
  },

  testAddNotAddingMultiples() {
    const el = dom.createElement(TagName.DIV);
    classlist.add(el, 'A');
    assertEquals('A', el.className);
    classlist.add(el, 'A');
    assertEquals('A', el.className);
    classlist.add(el, 'B');
    assertEquals('A B', el.className);
  },

  testAddNotAddingMultiplesSvg() {
    const el = dom.createElement(TagName.SVG);
    classlist.add(el, 'A');
    assertEquals('A', el.getAttribute('class'));
    classlist.add(el, 'A');
    assertEquals('A', el.getAttribute('class'));
    classlist.add(el, 'B');
    assertEquals('A B', el.getAttribute('class'));
  },

  testAddCaseSensitive() {
    const el = dom.createElement(TagName.DIV);
    classlist.add(el, 'A');
    assertTrue(classlist.contains(el, 'A'));
    assertFalse(classlist.contains(el, 'a'));
    classlist.add(el, 'a');
    assertTrue(classlist.contains(el, 'A'));
    assertTrue(classlist.contains(el, 'a'));
    assertEquals('A a', el.className);
  },

  testAddCaseSensitiveSvg() {
    const el = dom.createElement(TagName.SVG);
    classlist.add(el, 'A');
    assertTrue(classlist.contains(el, 'A'));
    assertFalse(classlist.contains(el, 'a'));
    classlist.add(el, 'a');
    assertTrue(classlist.contains(el, 'A'));
    assertTrue(classlist.contains(el, 'a'));
    assertEquals('A a', el.getAttribute('class'));
  },

  testAddAll() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo goog-bar';

    classlist.addAll(elem, ['goog-baz', 'foo']);
    assertEquals(3, classlist.get(elem).length);
    assertTrue(classlist.contains(elem, 'foo'));
    assertTrue(classlist.contains(elem, 'goog-bar'));
    assertTrue(classlist.contains(elem, 'goog-baz'));
  },

  testAddAllSvg() {
    const elem = dom.createElement(TagName.SVG);
    elem.setAttribute('class', 'foo goog-bar');

    classlist.addAll(elem, ['goog-baz', 'foo']);
    assertEquals(3, classlist.get(elem).length);
    assertTrue(classlist.contains(elem, 'foo'));
    assertTrue(classlist.contains(elem, 'goog-bar'));
    assertTrue(classlist.contains(elem, 'goog-baz'));
  },

  testAddAllEmpty() {
    const classes = 'foo bar';
    const elem = dom.createElement(TagName.DIV);
    elem.className = classes;

    classlist.addAll(elem, []);
    assertEquals(elem.className, classes);
  },

  testRemove() {
    const el = dom.createElement(TagName.DIV);
    el.className = 'A B C';
    classlist.remove(el, 'B');
    assertEquals('A C', el.className);
  },

  testRemoveSvg() {
    const el = dom.createElement(TagName.SVG);
    el.setAttribute('class', 'A B C');
    classlist.remove(el, 'B');
    assertEquals('A C', el.getAttribute('class'));
  },

  testRemoveCaseSensitive() {
    const el = dom.createElement(TagName.DIV);
    el.className = 'A B C';
    classlist.remove(el, 'b');
    assertEquals('A B C', el.className);
  },

  testRemoveAll() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo bar baz';

    classlist.removeAll(elem, ['bar', 'foo']);
    assertFalse(classlist.contains(elem, 'foo'));
    assertFalse(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'baz'));
  },

  testRemoveAllSvg() {
    const elem = dom.createElement(TagName.SVG);
    elem.setAttribute('class', 'foo bar baz');

    classlist.removeAll(elem, ['bar', 'foo']);
    assertFalse(classlist.contains(elem, 'foo'));
    assertFalse(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'baz'));
  },

  testRemoveAllOne() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo bar baz';

    classlist.removeAll(elem, ['bar']);
    assertFalse(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'foo'));
    assertTrue(classlist.contains(elem, 'baz'));
  },

  testRemoveAllSomeNotPresent() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo bar baz';

    classlist.removeAll(elem, ['a', 'bar']);
    assertTrue(classlist.contains(elem, 'foo'));
    assertFalse(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'baz'));
  },

  testRemoveAllCaseSensitive() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo bar baz';

    classlist.removeAll(elem, ['BAR', 'foo']);
    assertFalse(classlist.contains(elem, 'foo'));
    assertTrue(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'baz'));
  },

  testEnable() {
    const el = dom.getElement('p1');
    classlist.set(el, 'SOMECLASS FIRST');

    assertTrue('Should have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue(
        'Should have SOMECLASS class', classlist.contains(el, 'SOMECLASS'));

    classlist.enable(el, 'FIRST', false);

    assertFalse('Should not have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue(
        'Should have SOMECLASS class', classlist.contains(el, 'SOMECLASS'));

    classlist.enable(el, 'FIRST', true);

    assertTrue('Should have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue(
        'Should have SOMECLASS class', classlist.contains(el, 'SOMECLASS'));
  },

  /** @suppress {checkTypes} suppression added to enable type checking */
  testEnableNotAddingMultiples() {
    const el = dom.createElement(TagName.DIV);
    classlist.enable(el, 'A', true);
    assertEquals('A', el.className);
    classlist.enable(el, 'A', true);
    assertEquals('A', el.className);
    classlist.enable(el, 'B', 'B', true);
    assertEquals('A B', el.className);
  },

  testEnableAllRemove() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo bar baz';

    // Test removing some classes (some not present).
    classlist.enableAll(elem, ['a', 'bar'], false /* enable */);
    assertTrue(classlist.contains(elem, 'foo'));
    assertFalse(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'baz'));
    assertFalse(classlist.contains(elem, 'a'));
  },

  testEnableAllAdd() {
    const elem = dom.createElement(TagName.DIV);
    elem.className = 'foo bar';

    // Test adding some classes (some duplicate).
    classlist.enableAll(elem, ['a', 'bar', 'baz'], true /* enable */);
    assertTrue(classlist.contains(elem, 'foo'));
    assertTrue(classlist.contains(elem, 'bar'));
    assertTrue(classlist.contains(elem, 'baz'));
    assertTrue(classlist.contains(elem, 'a'));
  },

  testSwap() {
    const el = dom.getElement('p1');
    classlist.set(el, 'SOMECLASS FIRST');

    assertTrue('Should have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue('Should have FIRST class', classlist.contains(el, 'SOMECLASS'));
    assertFalse(
        'Should not have second class', classlist.contains(el, 'second'));

    classlist.swap(el, 'FIRST', 'second');

    assertFalse('Should not have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue('Should have FIRST class', classlist.contains(el, 'SOMECLASS'));
    assertTrue('Should have second class', classlist.contains(el, 'second'));

    classlist.swap(el, 'second', 'FIRST');

    assertTrue('Should have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue('Should have FIRST class', classlist.contains(el, 'SOMECLASS'));
    assertFalse(
        'Should not have second class', classlist.contains(el, 'second'));
  },

  testToggle() {
    const el = dom.getElement('p1');
    classlist.set(el, 'SOMECLASS FIRST');

    assertTrue('Should have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue(
        'Should have SOMECLASS class', classlist.contains(el, 'SOMECLASS'));

    let ret = classlist.toggle(el, 'FIRST');

    assertFalse('Should not have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue(
        'Should have SOMECLASS class', classlist.contains(el, 'SOMECLASS'));
    assertFalse('Return value should have been false', ret);

    ret = classlist.toggle(el, 'FIRST');

    assertTrue('Should have FIRST class', classlist.contains(el, 'FIRST'));
    assertTrue(
        'Should have SOMECLASS class', classlist.contains(el, 'SOMECLASS'));
    assertTrue('Return value should have been true', ret);
  },

  testAddRemoveString() {
    const el = dom.createElement(TagName.DIV);
    el.className = 'A';

    classlist.addRemove(el, 'A', 'B');
    assertEquals('B', el.className);

    classlist.addRemove(el, 'Z', 'C');
    assertEquals('B C', el.className);

    classlist.addRemove(el, 'C', 'D');
    assertEquals('B D', el.className);

    classlist.addRemove(el, 'D', 'B');
    assertEquals('B', el.className);
  },
});