2015-11-13 14:39:38 +01:00
|
|
|
/*---------------------------------------------------------------------------------------------
|
|
|
|
* Copyright (c) Microsoft Corporation. All rights reserved.
|
|
|
|
* Licensed under the MIT License. See License.txt in the project root for license information.
|
|
|
|
*--------------------------------------------------------------------------------------------*/
|
|
|
|
|
|
|
|
import * as assert from 'assert';
|
2016-08-23 14:47:54 +02:00
|
|
|
import * as dom from 'vs/base/browser/dom';
|
|
|
|
const $ = dom.$;
|
2015-11-13 14:39:38 +01:00
|
|
|
|
|
|
|
suite('dom', () => {
|
|
|
|
test('hasClass', () => {
|
|
|
|
|
2016-12-19 09:37:10 +01:00
|
|
|
let element = document.createElement('div');
|
2015-11-13 14:39:38 +01:00
|
|
|
element.className = 'foobar boo far';
|
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
assert(element.classList.contains('foobar'));
|
|
|
|
assert(element.classList.contains('boo'));
|
|
|
|
assert(element.classList.contains('far'));
|
|
|
|
assert(!element.classList.contains('bar'));
|
|
|
|
assert(!element.classList.contains('foo'));
|
|
|
|
assert(!element.classList.contains(''));
|
2015-11-13 14:39:38 +01:00
|
|
|
});
|
|
|
|
|
|
|
|
test('removeClass', () => {
|
|
|
|
|
2016-12-19 09:37:10 +01:00
|
|
|
let element = document.createElement('div');
|
2015-11-13 14:39:38 +01:00
|
|
|
element.className = 'foobar boo far';
|
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.remove('boo');
|
|
|
|
assert(element.classList.contains('far'));
|
|
|
|
assert(!element.classList.contains('boo'));
|
|
|
|
assert(element.classList.contains('foobar'));
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(element.className, 'foobar far');
|
2015-11-13 14:39:38 +01:00
|
|
|
|
|
|
|
element = document.createElement('div');
|
|
|
|
element.className = 'foobar boo far';
|
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.remove('far');
|
|
|
|
assert(!element.classList.contains('far'));
|
|
|
|
assert(element.classList.contains('boo'));
|
|
|
|
assert(element.classList.contains('foobar'));
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(element.className, 'foobar boo');
|
2015-11-13 14:39:38 +01:00
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.remove('boo');
|
|
|
|
assert(!element.classList.contains('far'));
|
|
|
|
assert(!element.classList.contains('boo'));
|
|
|
|
assert(element.classList.contains('foobar'));
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(element.className, 'foobar');
|
2015-11-13 14:39:38 +01:00
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.remove('foobar');
|
|
|
|
assert(!element.classList.contains('far'));
|
|
|
|
assert(!element.classList.contains('boo'));
|
|
|
|
assert(!element.classList.contains('foobar'));
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(element.className, '');
|
2015-11-13 14:39:38 +01:00
|
|
|
});
|
|
|
|
|
|
|
|
test('removeClass should consider hyphens', function () {
|
2016-12-19 09:37:10 +01:00
|
|
|
let element = document.createElement('div');
|
2015-11-13 14:39:38 +01:00
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.add('foo-bar');
|
|
|
|
element.classList.add('bar');
|
2017-05-02 12:51:43 +02:00
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
assert(element.classList.contains('foo-bar'));
|
|
|
|
assert(element.classList.contains('bar'));
|
2015-11-13 14:39:38 +01:00
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.remove('bar');
|
|
|
|
assert(element.classList.contains('foo-bar'));
|
|
|
|
assert(!element.classList.contains('bar'));
|
2015-11-13 14:39:38 +01:00
|
|
|
|
2020-10-06 10:25:24 +02:00
|
|
|
element.classList.remove('foo-bar');
|
|
|
|
assert(!element.classList.contains('foo-bar'));
|
|
|
|
assert(!element.classList.contains('bar'));
|
2015-11-13 14:39:38 +01:00
|
|
|
});
|
|
|
|
|
2020-10-15 13:55:12 +02:00
|
|
|
test('multibyteAwareBtoa', () => {
|
2020-12-08 09:40:42 +01:00
|
|
|
assert.ok(dom.multibyteAwareBtoa('hello world').length > 0);
|
|
|
|
assert.ok(dom.multibyteAwareBtoa('平仮名').length > 0);
|
2020-12-08 17:55:52 +01:00
|
|
|
assert.ok(dom.multibyteAwareBtoa(new Array(100000).fill('vs').join('')).length > 0); // https://github.com/microsoft/vscode/issues/112013
|
2020-10-15 13:55:12 +02:00
|
|
|
});
|
|
|
|
|
2016-08-23 14:47:54 +02:00
|
|
|
suite('$', () => {
|
|
|
|
test('should build simple nodes', () => {
|
|
|
|
const div = $('div');
|
|
|
|
assert(div);
|
|
|
|
assert(div instanceof HTMLElement);
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(div.tagName, 'DIV');
|
2016-08-23 14:47:54 +02:00
|
|
|
assert(!div.firstChild);
|
|
|
|
});
|
|
|
|
|
2020-08-17 09:07:33 +02:00
|
|
|
test('should buld nodes with id', () => {
|
|
|
|
const div = $('div#foo');
|
|
|
|
assert(div);
|
|
|
|
assert(div instanceof HTMLElement);
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(div.tagName, 'DIV');
|
|
|
|
assert.strictEqual(div.id, 'foo');
|
2020-08-17 09:07:33 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
test('should buld nodes with class-name', () => {
|
|
|
|
const div = $('div.foo');
|
|
|
|
assert(div);
|
|
|
|
assert(div instanceof HTMLElement);
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(div.tagName, 'DIV');
|
|
|
|
assert.strictEqual(div.className, 'foo');
|
2020-08-17 09:07:33 +02:00
|
|
|
});
|
|
|
|
|
2016-08-23 14:47:54 +02:00
|
|
|
test('should build nodes with attributes', () => {
|
|
|
|
let div = $('div', { class: 'test' });
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(div.className, 'test');
|
2016-08-23 14:47:54 +02:00
|
|
|
|
2018-12-28 22:15:41 +01:00
|
|
|
div = $('div', undefined);
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(div.className, '');
|
2016-08-23 14:47:54 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
test('should build nodes with children', () => {
|
2018-12-28 22:15:41 +01:00
|
|
|
let div = $('div', undefined, $('span', { id: 'demospan' }));
|
2016-08-23 14:47:54 +02:00
|
|
|
let firstChild = div.firstChild as HTMLElement;
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(firstChild.tagName, 'SPAN');
|
|
|
|
assert.strictEqual(firstChild.id, 'demospan');
|
2016-08-23 14:47:54 +02:00
|
|
|
|
2018-12-28 22:15:41 +01:00
|
|
|
div = $('div', undefined, 'hello');
|
2018-12-11 23:42:46 +01:00
|
|
|
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(div.firstChild && div.firstChild.textContent, 'hello');
|
2016-08-23 14:47:54 +02:00
|
|
|
});
|
2020-08-17 09:07:33 +02:00
|
|
|
|
|
|
|
test('should build nodes with text children', () => {
|
|
|
|
let div = $('div', undefined, 'foobar');
|
|
|
|
let firstChild = div.firstChild as HTMLElement;
|
2021-02-01 08:45:42 +01:00
|
|
|
assert.strictEqual(firstChild.tagName, undefined);
|
|
|
|
assert.strictEqual(firstChild.textContent, 'foobar');
|
2020-08-17 09:07:33 +02:00
|
|
|
});
|
2016-08-23 14:47:54 +02:00
|
|
|
});
|
2017-05-02 12:51:43 +02:00
|
|
|
});
|