@joist/element
Version:
Intelligently apply styles to WebComponents
167 lines • 8.81 kB
JavaScript
import { __esDecorate, __runInitializers } from "tslib";
import { assert } from "chai";
import { element } from "./element.js";
import { listen } from "./listen.js";
describe("@listen()", () => {
it("should add listener to an outer HTMLElement", (done) => {
let MyElement = (() => {
let _classDecorators = [element({
tagName: "listener-1",
})];
let _classDescriptor;
let _classExtraInitializers = [];
let _classThis;
let _classSuper = HTMLElement;
let _instanceExtraInitializers = [];
let _onClick_decorators;
var MyElement = class extends _classSuper {
static { _classThis = this; }
static {
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
_onClick_decorators = [listen("click")];
__esDecorate(this, null, _onClick_decorators, { kind: "method", name: "onClick", static: false, private: false, access: { has: obj => "onClick" in obj, get: obj => obj.onClick }, metadata: _metadata }, null, _instanceExtraInitializers);
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
MyElement = _classThis = _classDescriptor.value;
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
__runInitializers(_classThis, _classExtraInitializers);
}
onClick(e) {
assert.equal(e.type, "click");
done();
}
constructor() {
super(...arguments);
__runInitializers(this, _instanceExtraInitializers);
}
};
return MyElement = _classThis;
})();
const el = new MyElement();
document.body.append(el);
el.dispatchEvent(new Event("click"));
el.remove();
});
it("should add listener to the shadow root if available", (done) => {
let MyElement = (() => {
let _classDecorators = [element({
tagName: "listener-2",
shadowDom: [],
})];
let _classDescriptor;
let _classExtraInitializers = [];
let _classThis;
let _classSuper = HTMLElement;
let _instanceExtraInitializers = [];
let _onClick_decorators;
var MyElement = class extends _classSuper {
static { _classThis = this; }
static {
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
_onClick_decorators = [listen("click")];
__esDecorate(this, null, _onClick_decorators, { kind: "method", name: "onClick", static: false, private: false, access: { has: obj => "onClick" in obj, get: obj => obj.onClick }, metadata: _metadata }, null, _instanceExtraInitializers);
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
MyElement = _classThis = _classDescriptor.value;
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
__runInitializers(_classThis, _classExtraInitializers);
}
onClick(e) {
assert.equal(e.type, "click");
done();
}
constructor() {
super(...arguments);
__runInitializers(this, _instanceExtraInitializers);
}
};
return MyElement = _classThis;
})();
const el = new MyElement();
document.body.append(el);
el.shadowRoot?.dispatchEvent(new Event("click"));
el.remove();
});
it("should restrict argument to an event or an event subtype", (done) => {
class CustomEvent extends Event {
test = "Hello World";
constructor() {
super("customevent");
}
}
let MyElement = (() => {
let _classDecorators = [element({
tagName: "listener-3",
})];
let _classDescriptor;
let _classExtraInitializers = [];
let _classThis;
let _classSuper = HTMLElement;
let _instanceExtraInitializers = [];
let _onClick_decorators;
var MyElement = class extends _classSuper {
static { _classThis = this; }
static {
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
_onClick_decorators = [listen("customevent")];
__esDecorate(this, null, _onClick_decorators, { kind: "method", name: "onClick", static: false, private: false, access: { has: obj => "onClick" in obj, get: obj => obj.onClick }, metadata: _metadata }, null, _instanceExtraInitializers);
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
MyElement = _classThis = _classDescriptor.value;
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
__runInitializers(_classThis, _classExtraInitializers);
}
onClick(e) {
assert.equal(e.type, "customevent");
done();
}
constructor() {
super(...arguments);
__runInitializers(this, _instanceExtraInitializers);
}
};
return MyElement = _classThis;
})();
const el = new MyElement();
document.body.append(el);
el.dispatchEvent(new CustomEvent());
el.remove();
});
it("should respect a provided selector function", (done) => {
let MyElement = (() => {
let _classDecorators = [element({
tagName: "listener-4",
shadowDom: [],
})];
let _classDescriptor;
let _classExtraInitializers = [];
let _classThis;
let _classSuper = HTMLElement;
let _instanceExtraInitializers = [];
let _onClick_decorators;
var MyElement = class extends _classSuper {
static { _classThis = this; }
static {
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
_onClick_decorators = [listen("click", (host) => host)];
__esDecorate(this, null, _onClick_decorators, { kind: "method", name: "onClick", static: false, private: false, access: { has: obj => "onClick" in obj, get: obj => obj.onClick }, metadata: _metadata }, null, _instanceExtraInitializers);
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
MyElement = _classThis = _classDescriptor.value;
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
__runInitializers(_classThis, _classExtraInitializers);
}
onClick(e) {
assert.equal(e.type, "click");
done();
}
constructor() {
super(...arguments);
__runInitializers(this, _instanceExtraInitializers);
}
};
return MyElement = _classThis;
})();
const el = new MyElement();
document.body.append(el);
el.dispatchEvent(new Event("click"));
el.remove();
});
});
//# sourceMappingURL=listen.test.js.map