diff --git a/src/components/excel/Excel.ts b/src/components/excel/Excel.ts index 0c5caf4..7140ff8 100644 --- a/src/components/excel/Excel.ts +++ b/src/components/excel/Excel.ts @@ -1,9 +1,9 @@ import { $ } from 'core/dom'; import { Emitter } from 'core/Emitter'; import { ExcelComponent } from 'core/ExcelComponent'; -import { Store } from 'core/store/createStore'; +import { Store } from 'core/store/Store'; import { StoreSubscriber } from 'core/StoreSubscriber'; -import { updateOpenDate } from 'redux/actions'; +import { updateOpenDate } from 'redux/action-creators'; interface ExcelOptionsType { components: any[], @@ -48,7 +48,7 @@ export class Excel { this.subscriber.subscribeComponents(this.components); this.components.forEach(component => component.init()); - this.store.dispatch(updateOpenDate(Date.now().toString())); + this.store.dispatchToStore(updateOpenDate(Date.now().toString())); } destroy() { diff --git a/src/components/formula/Formula.ts b/src/components/formula/Formula.ts index 4b24f8b..12f5ecc 100644 --- a/src/components/formula/Formula.ts +++ b/src/components/formula/Formula.ts @@ -1,15 +1,18 @@ import { Dom } from 'core/dom'; -import { ExcelComponent } from 'core/ExcelComponent'; +import { ExcelComponent, ComponentOptionsType } from 'core/ExcelComponent'; export class Formula extends ExcelComponent { static className = 'excel__formula'; private formulaInput: Dom; - constructor($root: Dom, options: any) { + constructor($root: Dom, options: ComponentOptionsType) { super($root, { - listeners: ['input', 'keydown'], + // @ts-ignore next-line + eventListeners: ['input', 'keydown'], + // @ts-ignore next-line name: 'Formula', + // @ts-ignore next-line subscribe: ['currentText'], ...options, }); @@ -27,8 +30,8 @@ export class Formula extends ExcelComponent { this.formulaInput = this.$root.find('#formula-input'); - this.$on('table:select-cell', text => { - this.formulaInput.text = text || ''; + this.$on('table:select-cell', (cell: Dom) => { + this.formulaInput.text = cell.data.value || ''; }); } diff --git a/src/components/header/Header.ts b/src/components/header/Header.ts index 820a064..da01b26 100644 --- a/src/components/header/Header.ts +++ b/src/components/header/Header.ts @@ -1,16 +1,16 @@ -import * as actions from 'redux/actions'; +import * as actions from 'redux/action-creators'; import { $, Dom } from 'core/dom'; import { ActiveRoute } from 'core/routes/ActiveRoute'; -import { ExcelStateComponent } from 'core/ExcelStateComponent'; -import { deleteTable } from 'redux/actions'; +import { ExcelComponentState } from 'core/ExcelComponentState'; +import { deleteTable } from 'redux/action-creators'; -export class Header extends ExcelStateComponent { +export class Header extends ExcelComponentState { static className = 'excel__header'; constructor($root: Dom, options: any) { super($root, { name: 'Header', - listeners: ['input', 'click'], + eventListeners: ['input', 'click'], subscribe: ['title'], ...options, }); @@ -35,7 +35,7 @@ export class Header extends ExcelStateComponent { onInput(event: InputEvent) { const $target = $(event.target as HTMLInputElement); - this.$dispatch(actions.changeTitle($target.text)); + this.dispatchToStore(actions.changeTitle($target.text)); } onClick(event: MouseEvent) { @@ -54,7 +54,7 @@ export class Header extends ExcelStateComponent { } case 'delete-table': { - confirm('Действительно хочешь удалить ?') && this.$dispatch(deleteTable(this.store.getState().id)); + confirm('Действительно хочешь удалить ?') && this.dispatchToStore(deleteTable(this.store.getState().id)); break; } diff --git a/src/components/table/Table.ts b/src/components/table/Table.ts index 647df83..3283101 100644 --- a/src/components/table/Table.ts +++ b/src/components/table/Table.ts @@ -1,9 +1,9 @@ import { startCellId } from 'components/table/table.functions'; -import * as actions from 'redux/actions'; +import * as actions from 'redux/action-creators'; import { $, Dom } from 'core/dom'; import { ExcelComponent } from 'core/ExcelComponent'; import { TableSelection } from 'components/table/TableSelection'; -import { changeCurrentStyles } from 'redux/actions'; +import { changeCurrentStyles } from 'redux/action-creators'; import { createTable } from 'components/table/table.template'; import { initialStyleState } from 'src/constants'; import { parse } from 'core/utils'; @@ -18,7 +18,7 @@ export class Table extends ExcelComponent { constructor($root: Dom, options: any) { super($root, { name: 'Table', - listeners: ['mousedown', 'keydown', 'input'], + eventListeners: ['mousedown', 'keydown', 'input'], ...options, }); } @@ -34,36 +34,17 @@ export class Table extends ExcelComponent { init() { super.init(); - const $cell = this.$root.find(`[data-id="${startCellId}"]`); - this.selection.select($cell); - - this.$emit('table:select-cell', $cell.data.value); - - this.$on('formula:input', (data) => { - this.selection.current.attr('data-value', data); - this.selection.current.text = parse(data); - this.updateCurrentTextInStore(data); - }); - - this.$on('formula:enter-press', () => { - this.selection.current.focus(); - }); - - this.$on('toolbar:applyStyle', (value) => { - this.selection.applyStyle(value); - - this.$dispatch(actions.applyStyle({ - value, - ids: this.selection.selectedIds, - })); - }); - this.initTable(); + + this.$on('formula:input', this.updateCurrentText); + this.$on('formula:enter-press', () => this.selection.current.focus()); + this.$on('toolbar:applyStyle', this.updateCurrentStyles); } initTable() { this.initTableSize(); this.initTableContentAndStyles(); + this.initStartCellFocus(); } initTableSize() { @@ -87,6 +68,7 @@ export class Table extends ExcelComponent { const tableState = this.store.getState(); const tableContent = tableState?.dataState; const tableStyles = tableState?.stylesState; + Object.keys(tableContent).forEach(cellId => { const $cell = this.$root.find(`[data-id="${cellId}"]`); const styles = tableStyles[cellId]; @@ -97,28 +79,46 @@ export class Table extends ExcelComponent { }); } + initStartCellFocus() { + const $cell = this.$root.find(`[data-id="${startCellId}"]`); + this.selection.select($cell); + + this.$emit('table:select-cell', $cell); + } + emitSelectCallback() { - this.$emit('table:select-cell', this.selection.current.data.value); + this.$emit('table:select-cell', this.selection.current); const styles = this.selection.current?.getStyles(Object.keys(initialStyleState)); - this.$dispatch(changeCurrentStyles(styles)); + this.dispatchToStore(changeCurrentStyles(styles)); } async resizeTable(event: MouseEvent) { try { const resizeData = await resizeHandler(this.$root, event); - this.$dispatch(actions.tableResize({ resizeData })); + this.dispatchToStore(actions.tableResize({ resizeData })); } catch (e) { console.warn('Resize error', e.message); } } - updateCurrentTextInStore(text: string) { - this.$dispatch(actions.changeText({ + updateCurrentText = (text: string) => { + this.selection.current.attr('data-value', text); + this.selection.current.text = parse(text); + + this.dispatchToStore(actions.changeText({ text, id: this.selection.current.data.id || startCellId, })); - } + }; + + updateCurrentStyles = (style: CSSStyleRule) => { + this.selection.applyStyle(style); + this.dispatchToStore(actions.applyStyle({ + value: style, + ids: this.selection.selectedIds, + })); + }; onMousedown(event: MouseEvent) { selectHandler(event, this.selection, this.emitSelectCallback.bind(this)); @@ -130,6 +130,6 @@ export class Table extends ExcelComponent { } onInput(event: InputEvent) { - this.updateCurrentTextInStore((event.target as HTMLElement).innerText.trim()); + this.updateCurrentText((event.target as HTMLElement).innerText.trim()); } } diff --git a/src/components/toolbar/Toolbar.ts b/src/components/toolbar/Toolbar.ts index a0d4b41..5ea39e2 100644 --- a/src/components/toolbar/Toolbar.ts +++ b/src/components/toolbar/Toolbar.ts @@ -1,17 +1,17 @@ import { startCellId } from 'components/table/table.functions'; import { $, Dom } from 'core/dom'; -import { ExcelStateComponent } from 'core/ExcelStateComponent'; -import { OptionsType } from 'core/ExcelComponent'; +import { ExcelComponentState } from 'core/ExcelComponentState'; +import { ComponentOptionsType } from 'core/ExcelComponent'; import { createToolbar } from 'components/toolbar/toolbar.template'; import { initialStyleState } from 'src/constants'; -export class Toolbar extends ExcelStateComponent { +export class Toolbar extends ExcelComponentState { static className = 'excel__toolbar'; - constructor($root: Dom, options: OptionsType) { + constructor($root: Dom, options: ComponentOptionsType) { super($root, { ...options, - listeners: ['click'], + eventListeners: ['click', 'change'], name: 'Toolbar', subscribe: ['currentStyles'], }); @@ -20,7 +20,7 @@ export class Toolbar extends ExcelStateComponent { prepare() { const currentToolbarState = this.toolbarState; - this.initState(currentToolbarState); + this.initComponentState(currentToolbarState); } get toolbarState() { @@ -31,7 +31,7 @@ export class Toolbar extends ExcelStateComponent { } get template(): string { - return createToolbar(this.state); + return createToolbar(this.componentState); } toHTML(): string { @@ -39,7 +39,7 @@ export class Toolbar extends ExcelStateComponent { } storeChanged(args?: any) { - this.setState(args.currentStyles); + this.setComponentState(args.currentStyles); } onClick(event: MouseEvent) { @@ -51,7 +51,13 @@ export class Toolbar extends ExcelStateComponent { const key = Object.keys(value)[0]; this.$emit('toolbar:applyStyle', value); + this.setComponentState({ [key]: value[key] }); + } - this.setState({ [key]: value[key] }); + onChange(e: any) { + const value = `${e.target.value.toString()}px`; + + this.$emit('toolbar:applyStyle', { fontSize: value }); + this.setComponentState({ fontSize: value }); } } diff --git a/src/components/toolbar/toolbar-types.ts b/src/components/toolbar/toolbar-types.ts index 554722f..ebc85e4 100644 --- a/src/components/toolbar/toolbar-types.ts +++ b/src/components/toolbar/toolbar-types.ts @@ -4,4 +4,5 @@ export type ToolbarStateType = { textDecoration?: 'none' | 'underline'; justifyContent?: 'start' | 'center' | 'end'; alignItems?: 'start' | 'center' | 'end'; + fontSize?: any; }; diff --git a/src/components/toolbar/toolbar.template.ts b/src/components/toolbar/toolbar.template.ts index 6f610b7..a088bf6 100644 --- a/src/components/toolbar/toolbar.template.ts +++ b/src/components/toolbar/toolbar.template.ts @@ -80,7 +80,25 @@ export function createToolbar(state: ToolbarStateType): string { ], ]; - return btns.map(btn => (Array.isArray(btn) ? toButtonGroup(btn) : toButton(btn))).join(' '); + const buttons = btns.map(btn => (Array.isArray(btn) ? toButtonGroup(btn) : toButton(btn))); + buttons.push(createFontSizeButton(state.fontSize)); + return buttons.join(' '); +} + +function createFontSizeButton(currentSize: string) { + const fontSizeInPixels = +currentSize.slice(0, -2); + const options = []; + + for (let i = 8; i <= 24; i += 2) { + if (fontSizeInPixels === i) options.push(``); + else options.push(``); + } + + return ` + + `; } function toButtonGroup(buttons: ButtonConfigType[]) { diff --git a/src/constants.ts b/src/constants.ts index d15b079..cc34f29 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -8,6 +8,7 @@ export const initialStyleState: ToolbarStateType = { fontWeight: 'normal', textDecoration: 'none', fontStyle: 'normal', + fontSize: '12px', }; export function getNormalizeInitialState(params: string): StateType { @@ -15,12 +16,12 @@ export function getNormalizeInitialState(params: string): StateType { colState: {}, rowState: {}, dataState: {}, - currentText: '', stylesState: {}, title: 'New excel table', id: params, openDate: Date.now(), ...storage(`excel:${params}`), currentStyles: { ...storage(`excel:${params}`)?.stylesState?.[startCellId] }, + currentText: { ...storage(`excel:${params}`)?.dataState?.[startCellId] }, }; } diff --git a/src/core/Clients.ts b/src/core/Clients.ts index dafd38d..ff9ff4b 100644 --- a/src/core/Clients.ts +++ b/src/core/Clients.ts @@ -1,3 +1,4 @@ +import { startCellId } from 'components/table/table.functions'; import { storage } from 'core/utils'; import { storageName } from 'pages/ExcelPage'; import { StateType } from 'redux/types'; @@ -21,7 +22,7 @@ export class LocalStorageClient implements ClientDataType { } get() { - const data = storage(storageName(this.name)) || getNormalizeInitialState(this.name); + const data = this.norm(storage(storageName(this.name))) || getNormalizeInitialState(this.name); return new Promise(resolve => { setTimeout(() => { @@ -29,4 +30,12 @@ export class LocalStorageClient implements ClientDataType { }, 1500); }); } + + norm(state) { + return { + ...state, + currentStyles: { ...state.stylesState?.[startCellId] }, + currentText: state.dataState?.[startCellId], + }; + } } diff --git a/src/core/DomListener.ts b/src/core/DomListener.ts index 1d12548..812cdfa 100644 --- a/src/core/DomListener.ts +++ b/src/core/DomListener.ts @@ -3,19 +3,19 @@ import { capitalize } from 'core/utils'; export class DomListener { $root: Dom; - listeners: string[]; + eventListeners: string[]; - constructor($root: Dom, listeners: string[]) { + constructor($root: Dom, eventNames: string[]) { if (!$root) throw new Error('Не передали корневой элемент'); this.$root = $root; - this.listeners = listeners; + this.eventListeners = eventNames; } initDOMListeners() { - if (!this.listeners) return; + if (!this.eventListeners) return; - this.listeners.forEach((listener: string) => { + this.eventListeners.forEach((listener: string) => { const method: any = getMethodName(listener); // @ts-ignore FIXME: this[method] = this[method]?.bind(this); @@ -27,7 +27,7 @@ export class DomListener { } removeDOMListeners() { - this.listeners.forEach(listener => { + this.eventListeners.forEach(listener => { // @ts-ignore FIXME: const method: any = getMethodName(listener); // @ts-ignore FIXME: diff --git a/src/core/ExcelComponent.ts b/src/core/ExcelComponent.ts index d6abb32..6e61f39 100644 --- a/src/core/ExcelComponent.ts +++ b/src/core/ExcelComponent.ts @@ -2,7 +2,7 @@ import { ActionType } from 'redux/types'; import { Dom } from 'core/dom'; import { DomListener } from 'core/DomListener'; import { Emitter } from 'core/Emitter'; -import { Store } from 'core/store/createStore'; +import { Store } from 'core/store/Store'; interface ExcelComponentClass { toHTML: () => string; @@ -10,8 +10,8 @@ interface ExcelComponentClass { storeChanged?: (args: any) => void; } -export type OptionsType = { - listeners: string[]; +export type ComponentOptionsType = { + eventListeners: string[]; name: string; emitter: Emitter; store: Store; @@ -25,8 +25,8 @@ export abstract class ExcelComponent extends DomListener implements ExcelCompone private subscribe: string[]; private unsubscribers: ((args?: any) => any)[]; - constructor($root: Dom, options: OptionsType) { - super($root, options.listeners); + constructor($root: Dom, options: ComponentOptionsType) { + super($root, options.eventListeners); this.name = options.name; this.emitter = options.emitter; this.store = options.store; @@ -53,8 +53,8 @@ export abstract class ExcelComponent extends DomListener implements ExcelCompone unsub && this.unsubscribers.push(unsub); } - $dispatch(action: ActionType) { - this.store?.dispatch(action); + dispatchToStore(action: ActionType) { + this.store?.dispatchToStore(action); } storeChanged(args?: any) { diff --git a/src/core/ExcelComponentState.ts b/src/core/ExcelComponentState.ts new file mode 100644 index 0000000..9d8a187 --- /dev/null +++ b/src/core/ExcelComponentState.ts @@ -0,0 +1,27 @@ +import { Dom } from 'core/dom'; +import { ExcelComponent, ComponentOptionsType } from 'core/ExcelComponent'; + +type ExcelComponentStateType = { + [k: string]: any; +}; + +export abstract class ExcelComponentState extends ExcelComponent { + componentState: ExcelComponentStateType; + + protected constructor(root: Dom, options: ComponentOptionsType) { + super(root, options); + } + + get template(): string { + return JSON.stringify(this.componentState, null, 2); + } + + initComponentState(initialState = {}) { + this.componentState = { ...initialState }; + } + + setComponentState(newState: ExcelComponentStateType) { + this.componentState = { ...this.componentState, ...newState }; + this.$root.html(this.template); + } +} diff --git a/src/core/ExcelStateComponent.ts b/src/core/ExcelStateComponent.ts deleted file mode 100644 index b19185c..0000000 --- a/src/core/ExcelStateComponent.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { Dom } from 'core/dom'; -import { ExcelComponent, OptionsType } from 'core/ExcelComponent'; - -type ExcelComponentStateType = { - [k: string]: any; -}; - -export abstract class ExcelStateComponent extends ExcelComponent { - state: ExcelComponentStateType; - - protected constructor(root: Dom, options: OptionsType) { - super(root, options); - } - - get template(): string { - return JSON.stringify(this.state, null, 2); - } - - initState(initialState = {}) { - this.state = { ...initialState }; - } - - setState(newState: ExcelComponentStateType) { - this.state = { ...this.state, ...newState }; - this.$root.html(this.template); - } -} diff --git a/src/core/StoreSubscriber.ts b/src/core/StoreSubscriber.ts index f7a0e61..a5cb95e 100644 --- a/src/core/StoreSubscriber.ts +++ b/src/core/StoreSubscriber.ts @@ -1,5 +1,5 @@ import { StateType } from 'redux/types'; -import { Store } from 'core/store/createStore'; +import { Store } from 'core/store/Store'; import { isEqual } from 'core/utils'; export class StoreSubscriber { @@ -14,7 +14,7 @@ export class StoreSubscriber { subscribeComponents(components: any[]) { this.prevState = this.store.getState(); - this.sub = this.store.subscribe((state: StateType) => { + this.sub = this.store.subscribeFromStore((state: StateType) => { if (!state) return; Object.keys(state).forEach(key => { diff --git a/src/core/store/createStore.ts b/src/core/store/Store.ts similarity index 86% rename from src/core/store/createStore.ts rename to src/core/store/Store.ts index ff01a0d..e229fcf 100644 --- a/src/core/store/createStore.ts +++ b/src/core/store/Store.ts @@ -9,7 +9,7 @@ export class Store { this.listeners = []; } - subscribe(fn: (state: StateType) => void): SubscribeType { + subscribeFromStore(fn: (state: StateType) => void): SubscribeType { this.listeners.push(fn); return { unsubscribe: () => { @@ -18,7 +18,7 @@ export class Store { }; } - dispatch(action: ActionType) { + dispatchToStore(action: ActionType) { this.state = this.reducer(this.state, action); this.listeners.forEach(listener => listener(this.state)); } diff --git a/src/pages/ExcelPage.ts b/src/pages/ExcelPage.ts index ce47669..e2f163e 100644 --- a/src/pages/ExcelPage.ts +++ b/src/pages/ExcelPage.ts @@ -4,7 +4,7 @@ import { Formula } from 'components/formula/Formula'; import { Header } from 'components/header/Header'; import { LocalStorageClient } from 'core/Clients'; import { StateProcessor } from 'core/StateProcessor'; -import { Store } from 'core/store/createStore'; +import { Store } from 'core/store/Store'; import { SubscribeType } from 'redux/types'; import { Table } from 'components/table/Table'; import { Toolbar } from 'components/toolbar/Toolbar'; @@ -32,7 +32,7 @@ export class ExcelPage extends AbstractPage { const state = await this.processor.get(); const store = new Store(rootReducer, state); - this.storeSub = store.subscribe(this.processor.listen); + this.storeSub = store.subscribeFromStore(this.processor.listen); this.excel = new Excel({ components: [Header, Toolbar, Formula, Table], diff --git a/src/redux/constants.ts b/src/redux/action-constants.ts similarity index 100% rename from src/redux/constants.ts rename to src/redux/action-constants.ts diff --git a/src/redux/actions.ts b/src/redux/action-creators.ts similarity index 87% rename from src/redux/actions.ts rename to src/redux/action-creators.ts index 0660ef9..cf15f20 100644 --- a/src/redux/actions.ts +++ b/src/redux/action-creators.ts @@ -7,7 +7,7 @@ import { CHANGE_TITLE, DELETE_TABLE, UPDATE_DATE, -} from 'redux/constants'; +} from 'redux/action-constants'; export function tableResize(resizeData: any) { return { @@ -30,7 +30,7 @@ export function changeCurrentStyles(data: any) { }; } -export function applyStyle(data: any) { +export function applyStyle(data: { ids: (string | undefined)[], value: CSSStyleRule }) { return { type: APPLY_STYLES, data, diff --git a/src/redux/actions-types.d.ts b/src/redux/actions-types.d.ts deleted file mode 100644 index eecb847..0000000 --- a/src/redux/actions-types.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -export type ResizePayloadType = { - colState: { - [k in number]: number - }, - rowState: { - [k in number]: number - }, -}; diff --git a/src/redux/rootReducer.ts b/src/redux/rootReducer.ts index 93b5d2c..99ebbc9 100644 --- a/src/redux/rootReducer.ts +++ b/src/redux/rootReducer.ts @@ -9,7 +9,7 @@ import { CHANGE_TITLE, DELETE_TABLE, UPDATE_DATE, -} from 'redux/constants'; +} from 'redux/action-constants'; export function rootReducer(state: StateType, action: ActionType) { switch (action.type) { diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss index b1bb2b7..c2ff3d6 100644 --- a/src/styles/_variables.scss +++ b/src/styles/_variables.scss @@ -7,3 +7,4 @@ $info-cell-width: 40px; $row-height: 25px; $toolbar-height: 40px; $primary-color: #3c74ff; +$default-cell-font-size: 12px; diff --git a/src/styles/components/table.scss b/src/styles/components/table.scss index 7150acf..6ce27e2 100644 --- a/src/styles/components/table.scss +++ b/src/styles/components/table.scss @@ -7,6 +7,7 @@ right: 0; top: $header-height + $toolbar-height + $formula-height; overflow: auto; + font-size: $default-cell-font-size; .row{ display: flex; flex-direction: row; diff --git a/src/styles/components/toolbar.scss b/src/styles/components/toolbar.scss index 1cb6a7b..3ef0348 100644 --- a/src/styles/components/toolbar.scss +++ b/src/styles/components/toolbar.scss @@ -22,4 +22,8 @@ border: none; } } + + .button__size { + width: 50px; + } } diff --git a/test/createStore.spec.js b/test/createStore.spec.js index f98937e..8b5551e 100644 --- a/test/createStore.spec.js +++ b/test/createStore.spec.js @@ -23,8 +23,8 @@ describe('Create store', () => { test('should return store object', () => { expect(store).toBeDefined(); - expect(store.dispatch).toBeDefined(); - expect(store.subscribe).toBeDefined(); + expect(store.dispatchToStore).toBeDefined(); + expect(store.subscribeFromStore).toBeDefined(); expect(store.getState).not.toBeUndefined(); }); @@ -37,27 +37,27 @@ describe('Create store', () => { }); test('should change state if actions exist', () => { - store.dispatch({ type: 'ADD' }); + store.dispatchToStore({ type: 'ADD' }); expect(store.getState().count).toBe(1); }); test("should NOT change state if actions don't exist", () => { - store.dispatch({ type: 'NOT_EXISTING_TYPE' }); + store.dispatchToStore({ type: 'NOT_EXISTING_TYPE' }); expect(store.getState().count).toBe(0); }); test('should call subscriber', () => { - store.subscribe(handler); - store.dispatch({ type: 'ADD' }); + store.subscribeFromStore(handler); + store.dispatchToStore({ type: 'ADD' }); expect(handler).toHaveBeenCalled(); expect(handler).toHaveBeenCalledWith(store.getState()); }); test('should NOT call sub if unsubscribe', () => { - const unsub = store.subscribe(handler); + const unsub = store.subscribeFromStore(handler); unsub.unsubscribe(); - store.dispatch({ type: 'ADD' }); + store.dispatchToStore({ type: 'ADD' }); expect(handler).not.toHaveBeenCalled(); }); @@ -65,7 +65,7 @@ describe('Create store', () => { test('should dispatch in async way', () => { return new Promise(resolve => { setTimeout(() => { - store.dispatch({ type: 'ADD' }); + store.dispatchToStore({ type: 'ADD' }); }, 500); setTimeout(() => {