mirror of
https://github.com/EGroupware/egroupware.git
synced 2025-01-13 09:28:29 +01:00
- Sort out some type issues to reduce warnings/duplication
- Some tests for textbox
This commit is contained in:
parent
181b1c03ae
commit
4218b132f9
@ -15,7 +15,7 @@ import {SlotMixin} from "../../../../node_modules/@lion/core/src/SlotMixin.js";
|
||||
import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
|
||||
import {Et2Widget} from "../Et2Widget/Et2Widget";
|
||||
|
||||
export class Et2Button extends Et2InputWidget(Et2Widget(SlotMixin(LionButton)))
|
||||
export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
|
||||
{
|
||||
protected _created_icon_node : HTMLImageElement;
|
||||
protected clicked : boolean = false;
|
||||
@ -146,7 +146,7 @@ export class Et2Button extends Et2InputWidget(Et2Widget(SlotMixin(LionButton)))
|
||||
get _iconNode() : HTMLImageElement
|
||||
{
|
||||
return <HTMLImageElement>(Array.from(this.children)).find(
|
||||
el => el.slot === "icon",
|
||||
el => (<HTMLElement>el).slot === "icon",
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -122,7 +122,7 @@ export function formatDate(date: Date, options): string
|
||||
return _value;
|
||||
}
|
||||
|
||||
export class Et2Date extends Et2InputWidget(Et2Widget(LionInputDatepicker))
|
||||
export class Et2Date extends Et2InputWidget(LionInputDatepicker)
|
||||
{
|
||||
static get styles()
|
||||
{
|
||||
|
@ -1,4 +1,6 @@
|
||||
import {et2_IInput, et2_IInputNode} from "../et2_core_interfaces";
|
||||
import {Et2Widget} from "../Et2Widget/Et2Widget";
|
||||
import {dedupeMixin} from "../../../../node_modules/@lion/core/index.js";
|
||||
|
||||
/**
|
||||
* This mixin will allow any LitElement to become an Et2InputWidget
|
||||
@ -7,10 +9,9 @@ import {et2_IInput, et2_IInputNode} from "../et2_core_interfaces";
|
||||
* export class Et2Button extends Et2InputWidget(Et2Widget(LitWidget)) {...}
|
||||
*/
|
||||
|
||||
type Constructor<T = {}> = new (...args : any[]) => T;
|
||||
export const Et2InputWidget = <T extends Constructor>(superClass : T) =>
|
||||
{
|
||||
class Et2InputWidgetClass extends superClass implements et2_IInput, et2_IInputNode
|
||||
|
||||
const Et2InputWidgetClass = superclass =>
|
||||
class extends Et2Widget(superclass) implements et2_IInput, et2_IInputNode
|
||||
{
|
||||
|
||||
label : string = '';
|
||||
@ -31,9 +32,9 @@ export const Et2InputWidget = <T extends Constructor>(superClass : T) =>
|
||||
};
|
||||
}
|
||||
|
||||
constructor()
|
||||
constructor(...args : any[])
|
||||
{
|
||||
super();
|
||||
super(...args);
|
||||
|
||||
}
|
||||
|
||||
@ -67,7 +68,7 @@ export const Et2InputWidget = <T extends Constructor>(superClass : T) =>
|
||||
switch(typeof this._oldValue)
|
||||
{
|
||||
case "object":
|
||||
if(typeof this._oldValue.length !== "undefined" &&
|
||||
if(Array.isArray(this._oldValue) &&
|
||||
this._oldValue.length !== value.length
|
||||
)
|
||||
{
|
||||
@ -111,5 +112,5 @@ export const Et2InputWidget = <T extends Constructor>(superClass : T) =>
|
||||
return this._inputNode;
|
||||
}
|
||||
};
|
||||
return Et2InputWidgetClass as unknown as Constructor<et2_IInput> & T;
|
||||
}
|
||||
|
||||
export const Et2InputWidget = dedupeMixin(Et2InputWidgetClass);
|
39
api/js/etemplate/Et2InputWidget/test/InputBase.test.ts
Normal file
39
api/js/etemplate/Et2InputWidget/test/InputBase.test.ts
Normal file
@ -0,0 +1,39 @@
|
||||
/**
|
||||
* Common base for easily running some standard tests on all input widgets
|
||||
*
|
||||
* This file should not get run on its own, extend it
|
||||
*
|
||||
* TODO: Not sure exactly how to make this happen yet. Maybe:
|
||||
* https://github.com/mochajs/mocha/wiki/Shared-Behaviours
|
||||
* <code>
|
||||
* shared:
|
||||
* exports.shouldBehaveLikeAUser = function() {
|
||||
* it('should have .name.first', function() {
|
||||
* this.user.name.first.should.equal('tobi');
|
||||
* })
|
||||
*
|
||||
* it('should have .name.last', function() {
|
||||
* this.user.name.last.should.equal('holowaychuk');
|
||||
* })
|
||||
*
|
||||
* describe('.fullname()', function() {
|
||||
* it('should return the full name', function() {
|
||||
* this.user.fullname().should.equal('tobi holowaychuk');
|
||||
* })
|
||||
* })
|
||||
* };
|
||||
* test.js:
|
||||
*
|
||||
* var User = require('./user').User
|
||||
* , Admin = require('./user').Admin
|
||||
* , shared = require('./shared');
|
||||
*
|
||||
* describe('User', function() {
|
||||
* beforeEach(function() {
|
||||
* this.user = new User('tobi', 'holowaychuk');
|
||||
* })
|
||||
*
|
||||
* shared.shouldBehaveLikeAUser();
|
||||
* })
|
||||
* </code>
|
||||
*/
|
@ -15,7 +15,7 @@ import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
|
||||
import {Et2Widget} from "../Et2Widget/Et2Widget";
|
||||
|
||||
|
||||
export class Et2Textarea extends Et2InputWidget(Et2Widget(LionTextarea))
|
||||
export class Et2Textarea extends Et2InputWidget(LionTextarea)
|
||||
{
|
||||
static get styles()
|
||||
{
|
||||
|
@ -12,9 +12,8 @@
|
||||
import {css, html} from "../../../../node_modules/@lion/core/index.js"
|
||||
import {LionInput} from "../../../../node_modules/@lion/input/index.js"
|
||||
import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
|
||||
import {Et2Widget} from "../Et2Widget/Et2Widget";
|
||||
|
||||
export class Et2Textbox extends Et2InputWidget(Et2Widget(LionInput))
|
||||
export class Et2Textbox extends Et2InputWidget(LionInput)
|
||||
{
|
||||
|
||||
static get styles()
|
||||
@ -35,9 +34,9 @@ export class Et2Textbox extends Et2InputWidget(Et2Widget(LionInput))
|
||||
}
|
||||
}
|
||||
|
||||
constructor()
|
||||
constructor(...args : any[])
|
||||
{
|
||||
super();
|
||||
super(...args);
|
||||
}
|
||||
|
||||
connectedCallback()
|
||||
|
32
api/js/etemplate/Et2Textbox/test/Et2Textbox.test.ts
Normal file
32
api/js/etemplate/Et2Textbox/test/Et2Textbox.test.ts
Normal file
@ -0,0 +1,32 @@
|
||||
/**
|
||||
* Test file for Etemplate webComponent Textbox
|
||||
*/
|
||||
import {assert, fixture} from '@open-wc/testing';
|
||||
import {Et2Textbox} from "../Et2Textbox";
|
||||
import {html} from "lit-element";
|
||||
|
||||
describe("Textbox widget", () =>
|
||||
{
|
||||
// Reference to component under test
|
||||
let element : Et2Textbox;
|
||||
|
||||
// Setup run before each test
|
||||
beforeEach(async() =>
|
||||
{
|
||||
// Create an element to test with, and wait until it's ready
|
||||
element = await fixture<Et2Textbox>(html`
|
||||
<et2-textbox></et2-textbox>
|
||||
`);
|
||||
});
|
||||
|
||||
it('is defined', () =>
|
||||
{
|
||||
assert.instanceOf(element, Et2Textbox);
|
||||
});
|
||||
|
||||
it('has a label', () =>
|
||||
{
|
||||
element.set_label("Yay label");
|
||||
assert.isEmpty(element.shadowRoot.querySelectorAll('.et2_label'));
|
||||
})
|
||||
});
|
34
api/js/etemplate/Et2Textbox/test/Et2TextboxValues.test.ts
Normal file
34
api/js/etemplate/Et2Textbox/test/Et2TextboxValues.test.ts
Normal file
@ -0,0 +1,34 @@
|
||||
/**
|
||||
* Testing Et2Textbox input / values
|
||||
*/
|
||||
|
||||
import {assert, fixture} from "@open-wc/testing";
|
||||
import {html} from "lit-html";
|
||||
import {Et2Textbox} from "../Et2Textbox";
|
||||
|
||||
describe("Textbox input / values", () =>
|
||||
{
|
||||
// Reference to component under test
|
||||
let element : Et2Textbox;
|
||||
|
||||
// Setup run before each test
|
||||
beforeEach(async() =>
|
||||
{
|
||||
// Create an element to test with, and wait until it's ready
|
||||
element = await fixture<Et2Textbox>(html`
|
||||
<et2-textbox></et2-textbox>
|
||||
`);
|
||||
});
|
||||
|
||||
it("Takes a value", () =>
|
||||
{
|
||||
/*
|
||||
Complains about set_value() being missing?
|
||||
let test_value = "test value";
|
||||
debugger;
|
||||
element.set_value(test_value);
|
||||
assert(document.querySelector('input').should.have.text(test_value))
|
||||
|
||||
*/
|
||||
})
|
||||
});
|
@ -7,7 +7,7 @@ import {et2_cloneObject, et2_csvSplit} from "../et2_core_common";
|
||||
// @ts-ignore
|
||||
import type {IegwAppLocal} from "../../jsapi/egw_global";
|
||||
import {ClassWithAttributes, ClassWithInterfaces} from "../et2_core_inheritance";
|
||||
import {LitElement} from "@lion/core";
|
||||
import {LitElement} from "../../../../node_modules/@lion/core/index.js";
|
||||
import type {et2_container} from "../et2_core_baseWidget";
|
||||
|
||||
/**
|
||||
@ -21,6 +21,19 @@ import type {et2_container} from "../et2_core_baseWidget";
|
||||
*
|
||||
* @see Mixin explanation https://lit.dev/docs/composition/mixins/
|
||||
*/
|
||||
function applyMixins(derivedCtor : any, baseCtors : any[])
|
||||
{
|
||||
baseCtors.forEach(baseCtor =>
|
||||
{
|
||||
Object.getOwnPropertyNames(baseCtor.prototype).forEach(name =>
|
||||
{
|
||||
if(name !== 'constructor')
|
||||
{
|
||||
derivedCtor.prototype[name] = baseCtor.prototype[name];
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
type Constructor<T = {}> = new (...args : any[]) => T;
|
||||
export const Et2Widget = <T extends Constructor<LitElement>>(superClass : T) =>
|
||||
@ -778,19 +791,6 @@ export const Et2Widget = <T extends Constructor<LitElement>>(superClass : T) =>
|
||||
}
|
||||
};
|
||||
|
||||
function applyMixins(derivedCtor : any, baseCtors : any[])
|
||||
{
|
||||
baseCtors.forEach(baseCtor =>
|
||||
{
|
||||
Object.getOwnPropertyNames(baseCtor.prototype).forEach(name =>
|
||||
{
|
||||
if(name !== 'constructor')
|
||||
{
|
||||
derivedCtor.prototype[name] = baseCtor.prototype[name];
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Add some more stuff in
|
||||
applyMixins(Et2WidgetClass, [ClassWithInterfaces]);
|
||||
|
Loading…
Reference in New Issue
Block a user