tsai
/
grapesjs
mirror of https://github.com/artf/grapesjs.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Up style_manager tests

pull/5642/head
Artur Arseniev 2 years ago
parent
e6db9b56cc
commit
1acb553a5e
5 changed files with 89 additions and 109 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/style_manager/model/PropertyComposite.ts
  2. 44
      test/specs/style_manager/view/PropertyColorView.ts
  3. 43
      test/specs/style_manager/view/PropertyCompositeView.ts
  4. 71
      test/specs/style_manager/view/PropertyIntegerView.ts
  5. 38
      test/specs/style_manager/view/PropertyView.ts

2
src/style_manager/model/PropertyComposite.ts
View File

@ -31,7 +31,7 @@ export interface PropertyCompositeProps extends PropertyProps {
/**
* Value used to split property values, default `" "`.
*/
separator: string;
separator?: string;
/**
* Value used to join property values, default `" "`.

44
test/specs/style_manager/view/PropertyColorView.js → test/specs/style_manager/view/PropertyColorView.ts
View File

@ -1,30 +1,29 @@
import PropertyColorView from 'style_manager/view/PropertyColorView';
import Property from 'style_manager/model/Property';
import Component from 'dom_components/model/Component';
import Editor from 'editor/model/Editor';
import DomComponents from 'dom_components';
import PropertyColorView from '../../../../src/style_manager/view/PropertyColorView';
import Property from '../../../../src/style_manager/model/Property';
import Component from '../../../../src/dom_components/model/Component';
import Editor from '../../../../src/editor/model/Editor';
describe('PropertyColorView', () => {
let em;
let dcomp;
let compOpts;
let component;
let fixtures;
let target;
let model;
let view;
let em: Editor;
let dcomp: Editor['Components'];
let compOpts: any;
let component: Component;
var fixtures: HTMLElement;
let target: Component;
let model: Property;
let view: PropertyColorView;
let propName = 'testprop';
let propValue = '#fff';
beforeAll(() => {
$.fn.spectrum = function () {
($.fn as any).spectrum = function () {
return this;
};
});
beforeEach(() => {
em = new Editor({});
dcomp = new DomComponents(em);
em = new Editor();
dcomp = em.Components;
compOpts = { em, componentTypes: dcomp.componentTypes };
target = new Component({}, compOpts);
component = new Component({}, compOpts);
@ -37,19 +36,13 @@ describe('PropertyColorView', () => {
);
view = new PropertyColorView({ model });
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.firstChild;
fixtures = document.body.firstChild as HTMLElement;
view.render();
fixtures.appendChild(view.el);
});
afterEach(() => {
//view.remove(); // strange errors ???
});
afterAll(() => {
component = null;
view = null;
model = null;
em.destroy();
});
test('Rendered correctly', () => {
@ -97,7 +90,8 @@ describe('PropertyColorView', () => {
describe('Init property', () => {
beforeEach(() => {
component = new Component();
em = new Editor();
component = new Component({}, { em });
model = new Property({
type: 'color',
property: propName,

43
test/specs/style_manager/view/PropertyCompositeView.js → test/specs/style_manager/view/PropertyCompositeView.ts
View File

@ -1,18 +1,17 @@
import PropertyCompositeView from 'style_manager/view/PropertyCompositeView';
import PropertyComposite from 'style_manager/model/PropertyComposite';
import Component from 'dom_components/model/Component';
import Editor from 'editor/model/Editor';
import DomComponents from 'dom_components';
import PropertyCompositeView from '../../../../src/style_manager/view/PropertyCompositeView';
import PropertyComposite from '../../../../src/style_manager/model/PropertyComposite';
import Component from '../../../../src/dom_components/model/Component';
import Editor from '../../../../src/editor/model/Editor';
describe('PropertyCompositeView', () => {
let em;
let dcomp;
let compOpts;
var component;
var fixtures;
var target;
var model;
var view;
let em: Editor;
let dcomp: Editor['Components'];
let compOpts: any;
var component: Component;
var fixtures: HTMLElement;
var target: Component;
var model: PropertyComposite;
var view: PropertyCompositeView;
var propName = 'testprop';
var properties = [
{
@ -21,7 +20,7 @@ describe('PropertyCompositeView', () => {
{
type: 'integer',
property: 'subprop2',
defaults: 0,
defaults: '0',
units: ['%', 'px'],
},
{
@ -33,12 +32,12 @@ describe('PropertyCompositeView', () => {
];
beforeEach(() => {
em = new Editor({});
dcomp = new DomComponents(em);
em = new Editor();
dcomp = em.Components;
compOpts = { em, componentTypes: dcomp.componentTypes };
target = new Component({}, compOpts);
component = new Component({}, compOpts);
target.model = component;
// target.model = component;
model = new PropertyComposite(
{
type: 'composite',
@ -49,15 +48,13 @@ describe('PropertyCompositeView', () => {
);
view = new PropertyCompositeView({ model });
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.firstChild;
fixtures = document.body.firstChild as HTMLElement;
view.render();
fixtures.appendChild(view.el);
});
afterAll(() => {
component = null;
view = null;
model = null;
afterEach(() => {
em.destroy();
});
test('Rendered correctly', () => {
@ -73,7 +70,7 @@ describe('PropertyCompositeView', () => {
});
test('Properties rendered correctly', () => {
var children = view.el.querySelector('.properties').children;
var children = view.el.querySelector('.properties')!.children;
expect(children.length).toEqual(properties.length);
});

71
test/specs/style_manager/view/PropertyIntegerView.js → test/specs/style_manager/view/PropertyIntegerView.ts
View File

@ -1,30 +1,29 @@
import PropertyNumberView from 'style_manager/view/PropertyNumberView';
import PropertyNumber from 'style_manager/model/PropertyNumber';
import Component from 'dom_components/model/Component';
import Editor from 'editor/model/Editor';
import DomComponents from 'dom_components';
import PropertyNumberView from '../../../../src/style_manager/view/PropertyNumberView';
import PropertyNumber from '../../../../src/style_manager/model/PropertyNumber';
import Component from '../../../../src/dom_components/model/Component';
import Editor from '../../../../src/editor/model/Editor';
import DomComponents from '../../../../src/dom_components';
describe('PropertyNumberView', () => {
let em;
let dcomp;
let compOpts;
var component;
var fixtures;
var target;
var model;
var view;
var propName = 'testprop';
var intValue = '55';
var unitValue = 'px';
var propValue = intValue + unitValue;
var units = ['px', '%', 'em'];
var minValue = -15;
var maxValue = 75;
var unitsElSel = '.field-units select';
let em: Editor;
let dcomp: Editor['Components'];
let compOpts: any;
let component: Component;
let fixtures: HTMLElement;
let target: Component;
let model: PropertyNumber;
let view: PropertyNumberView;
let propName = 'testprop';
let intValue = '55';
let unitValue = 'px';
let units = ['px', '%', 'em'];
let minValue = -15;
let maxValue = 75;
let unitsElSel = '.field-units select';
beforeEach(() => {
em = new Editor({});
dcomp = new DomComponents(em);
em = new Editor();
dcomp = em.Components;
compOpts = { em, componentTypes: dcomp.componentTypes };
target = new Component({}, compOpts);
component = new Component({}, compOpts);
@ -37,19 +36,13 @@ describe('PropertyNumberView', () => {
);
view = new PropertyNumberView({ model });
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.firstChild;
fixtures = document.body.firstChild as HTMLElement;
view.render();
fixtures.appendChild(view.el);
});
afterEach(() => {
//view.remove(); // strange errors ???
});
afterAll(() => {
component = null;
view = null;
model = null;
em.destroy();
});
test('Rendered correctly', () => {
@ -66,12 +59,12 @@ describe('PropertyNumberView', () => {
});
test('Units rendered', () => {
var select = view.el.querySelector(unitsElSel);
var select = view.el.querySelector(unitsElSel)!;
expect(select.children.length).toEqual(units.length + 1); // (+ hidden option)
});
test('Units rendered correctly', () => {
var children = view.el.querySelector(unitsElSel).children;
var children = view.el.querySelector(unitsElSel)!.children;
expect(children[1].textContent).toEqual(units[0]);
expect(children[2].textContent).toEqual(units[1]);
expect(children[3].textContent).toEqual(units[2]);
@ -87,8 +80,8 @@ describe('PropertyNumberView', () => {
test('Update model on setValue', () => {
view.inputInst.setValue(intValue + unitValue);
expect(view.model.get('value')).toEqual(parseFloat(intValue));
expect(view.model.get('unit')).toEqual(unitValue);
expect(model.get('value')).toEqual(parseFloat(intValue));
expect(model.get('unit')).toEqual(unitValue);
expect(view.getInputEl().value).toEqual(intValue);
});
@ -100,7 +93,7 @@ describe('PropertyNumberView', () => {
test('Update model on unit change', () => {
view.inputInst.unitEl.value = units[1];
view.inputInst.handleUnitChange({ stopPropagation() {} });
expect(view.model.get('unit')).toEqual(units[1]);
expect(model.get('unit')).toEqual(units[1]);
});
test('Update input on value change', () => {
@ -110,7 +103,7 @@ describe('PropertyNumberView', () => {
describe('Init property', () => {
beforeEach(() => {
component = new Component();
component = new Component({}, compOpts);
model = new PropertyNumber(
{
units,
@ -131,8 +124,8 @@ describe('PropertyNumberView', () => {
});
test('Value as default', () => {
expect(view.model.getValue()).toEqual(intValue);
expect(view.model.getUnit()).toEqual(units[1]);
expect(model.getValue()).toEqual(intValue);
expect(model.getUnit()).toEqual(units[1]);
});
test('Input value is as default', () => {

38
test/specs/style_manager/view/PropertyView.js → test/specs/style_manager/view/PropertyView.ts
View File

@ -1,25 +1,24 @@
import PropertyView from 'style_manager/view/PropertyView';
import Property from 'style_manager/model/Property';
import Editor from 'editor/model/Editor';
import DomComponents from 'dom_components';
import Component from 'dom_components/model/Component';
import PropertyView from '../../../../src/style_manager/view/PropertyView';
import Property from '../../../../src/style_manager/model/Property';
import Editor from '../../../../src/editor/model/Editor';
import Component from '../../../../src/dom_components/model/Component';
describe('PropertyView', () => {
let em;
let dcomp;
let compOpts;
var component;
var fixtures;
var target;
var model;
var view;
let em: Editor;
let dcomp: Editor['Components'];
let compOpts: any;
var component: Component;
var fixtures: HTMLElement;
var target: Component;
var model: Property;
var view: PropertyView;
var propName = 'testprop';
var propValue = 'testvalue';
var defValue = 'testDefault';
beforeEach(() => {
em = new Editor({});
dcomp = new DomComponents(em);
dcomp = em.Components;
compOpts = { em, componentTypes: dcomp.componentTypes };
target = new Component({}, compOpts);
component = new Component({}, compOpts);
@ -29,17 +28,13 @@ describe('PropertyView', () => {
config: { em },
});
document.body.innerHTML = '<div id="fixtures"></div>';
fixtures = document.body.firstChild;
fixtures = document.body.firstChild as HTMLElement;
view.render();
fixtures.appendChild(view.el);
});
afterEach(() => {
//view.remove(); // strange errors ???
});
afterAll(() => {
component = null;
em.destroy();
});
test('Rendered correctly', () => {
@ -82,7 +77,8 @@ describe('PropertyView', () => {
describe('Init property', () => {
beforeEach(() => {
component = new Component();
em = new Editor({});
component = new Component({}, { em });
model = new Property({
property: propName,
default: defValue,
Write Preview
Loading…
Cancel
Save