IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-02-25 18:55:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

Remove the large and unnecessary dependency on React and 87 other related libraries. Fixes #4018

Browse Source
This commit is contained in:
Aditya Toshniwal
2019-03-07 10:51:59 +00:00
committed by Dave Page
parent d7bf6ec69f
commit 4b895941b3
31 changed files with 792 additions and 3465 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
web/regression/javascript/code_mirror_spec.jsx
View File

@@ -1,68 +0,0 @@
/////////////////////////////////////////////////////////////
//
// pgAdmin 4 - PostgreSQL Tools
//
// Copyright (C) 2013 - 2019, The pgAdmin Development Team
// This software is released under the PostgreSQL Licence
//
//////////////////////////////////////////////////////////////
import React from 'react';
import $ from 'jquery';
import CodeMirror from '../../pgadmin/static/jsx/history/detail/code_mirror';
import jasmineEnzyme from 'jasmine-enzyme';
import {shallow} from 'enzyme';
import './helper/enzyme.helper';
describe('CodeMirror', () => {
beforeEach(() => {
jasmineEnzyme();
});
describe('#hydrateWhenBecomesVisible', () => {
let codeMirror, isVisibleSpy;
beforeEach(() => {
codeMirror = shallow(<CodeMirror />).instance();
isVisibleSpy = spyOn($.fn, 'is');
spyOn(codeMirror, 'hydrate');
});
describe('when component is visible', () => {
beforeEach(() => {
isVisibleSpy.and.returnValue(true);
});
it('should hydrate the codemirror element', () => {
codeMirror.hydrateWhenBecomesVisible();
expect(codeMirror.hydrate).toHaveBeenCalledTimes(1);
});
});
describe('when component is not visible', () => {
beforeEach(() => {
isVisibleSpy.and.returnValue(false);
});
it('should not hydrate the codemirror element', () => {
codeMirror.hydrateWhenBecomesVisible();
expect(codeMirror.hydrate).not.toHaveBeenCalled();
});
describe('when becomes visible', () => {
beforeEach(() => {
isVisibleSpy.and.returnValue(true);
});
it('should hydrate the codemirror element', (done) => {
setTimeout(() => {
codeMirror.hydrateWhenBecomesVisible();
expect(codeMirror.hydrate).toHaveBeenCalledTimes(1);
done();
}, 150);
});
});
});
});
});

13
web/regression/javascript/helper/enzyme.helper.js
View File

@@ -1,13 +0,0 @@
/////////////////////////////////////////////////////////////
//
// pgAdmin 4 - PostgreSQL Tools
//
// Copyright (C) 2013 - 2019, The pgAdmin Development Team
// This software is released under the PostgreSQL Licence
//
//////////////////////////////////////////////////////////////
import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
Enzyme.configure({adapter: new Adapter()});

16
web/regression/javascript/history/history_collection_spec.js
View File

@@ -7,18 +7,17 @@
//
//////////////////////////////////////////////////////////////
import HistoryCollection from '../../../pgadmin/static/js/history/history_collection';
import '../helper/enzyme.helper';
import HistoryCollection from 'sources/sqleditor/history/history_collection';
describe('historyCollection', function () {
let historyCollection, historyModel, onChangeSpy, onResetSpy;
let historyCollection, historyModel, onAddSpy, onResetSpy;
beforeEach(() => {
historyModel = [{some: 'thing', someOther: ['array element']}];
historyCollection = new HistoryCollection(historyModel);
onChangeSpy = jasmine.createSpy('onChangeHandler');
onAddSpy = jasmine.createSpy('onAddHandler');
onResetSpy = jasmine.createSpy('onResetHandler');
historyCollection.onChange(onChangeSpy);
historyCollection.onAdd(onAddSpy);
historyCollection.onReset(onResetSpy);
});
@@ -36,12 +35,13 @@ describe('historyCollection', function () {
describe('add', function () {
let expectedHistory;
let newEntry = {some: 'new thing', someOther: ['value1', 'value2']};
beforeEach(() => {
historyCollection.add({some: 'new thing', someOther: ['value1', 'value2']});
historyCollection.add(newEntry);
expectedHistory = [
{some: 'thing', someOther: ['array element']},
{some: 'new thing', someOther: ['value1', 'value2']},
{some: 'thing', someOther: ['array element']},
];
});
@@ -50,7 +50,7 @@ describe('historyCollection', function () {
});
it('calls the onChange function', function () {
expect(onChangeSpy).toHaveBeenCalledWith(expectedHistory);
expect(onAddSpy).toHaveBeenCalledWith(newEntry);
});
});

271
web/regression/javascript/history/query_history_spec.jsx → web/regression/javascript/history/query_history_spec.js
View File

@@ -9,59 +9,38 @@
/* eslint-disable react/no-find-dom-node */
import jasmineEnzyme from 'jasmine-enzyme';
import React from 'react';
import ReactDOM from 'react-dom';
import QueryHistory from 'sources/sqleditor/history/query_history';
import HistoryCollection from 'sources/sqleditor/history/history_collection';
import clipboard from 'sources/selection/clipboard';
import $ from 'jquery';
import moment from 'moment';
import QueryHistory from '../../../pgadmin/static/jsx/history/query_history';
import QueryHistoryEntry from '../../../pgadmin/static/jsx/history/query_history_entry';
import QueryHistoryEntryDateGroup from '../../../pgadmin/static/jsx/history/query_history_entry_date_group';
import QueryHistoryEntries from '../../../pgadmin/static/jsx/history/query_history_entries';
import QueryHistoryDetail from '../../../pgadmin/static/jsx/history/query_history_detail';
import HistoryCollection from '../../../pgadmin/static/js/history/history_collection';
import clipboard from '../../../pgadmin/static/js/selection/clipboard';
import {mount} from 'enzyme';
import '../helper/enzyme.helper';
describe('QueryHistory', () => {
let historyCollection;
let historyWrapper;
let sqlEditorPref = {sql_font_size: '1em'};
let sqlEditorPref = {sql_font_size: '1.5em'};
let historyComponent;
beforeEach(() => {
jasmineEnzyme();
historyWrapper = $('<div id="history_grid"></div>').appendTo('body');
});
describe('when there is no history', () => {
beforeEach(() => {
historyCollection = new HistoryCollection([]);
historyWrapper = mount(<QueryHistory historyCollection={historyCollection}
sqlEditorPref={sqlEditorPref}
/>);
});
describe('when we switch to the query history tab', () => {
beforeEach(() => {
historyWrapper.instance().refocus();
spyOn(historyWrapper.instance(), 'retrieveSelectedQuery');
});
it('does not try to focus on any element', () => {
expect(historyWrapper.instance().retrieveSelectedQuery).not.toHaveBeenCalled();
});
historyComponent = new QueryHistory(historyWrapper, historyCollection);
historyComponent.render();
});
it('has no entries', (done) => {
let foundChildren = historyWrapper.find(QueryHistoryEntry);
let foundChildren = historyWrapper.find('#query_list');
expect(foundChildren.length).toBe(0);
done();
});
it('nothing is displayed in the history details panel', (done) => {
let foundChildren = historyWrapper.find(QueryHistoryDetail);
expect(foundChildren.length).toBe(0);
it('No history found is displayed', (done) => {
expect(historyWrapper.find('.pg-panel-message').html()).toBe('No history found');
done();
});
});
@@ -69,8 +48,6 @@ describe('QueryHistory', () => {
describe('when there is history', () => {
let queryEntries;
let queryDetail;
let isInvisibleSpy;
let queryHistoryEntriesComponent;
describe('when two SQL queries were executed', () => {
@@ -90,91 +67,38 @@ describe('QueryHistory', () => {
total_time: '234 msec',
message: 'something important ERROR: message from second sql query',
}];
historyCollection = new HistoryCollection(historyObjects);
historyWrapper = mount(<QueryHistory historyCollection={historyCollection}
sqlEditorPref={sqlEditorPref}
/>);
historyComponent = new QueryHistory(historyWrapper, historyCollection);
historyComponent.render();
queryHistoryEntriesComponent = historyWrapper.find(QueryHistoryEntries);
isInvisibleSpy = spyOn(queryHistoryEntriesComponent.instance(), 'isInvisible')
.and.returnValue(false);
queryEntries = queryHistoryEntriesComponent.find(QueryHistoryEntry);
queryDetail = historyWrapper.find(QueryHistoryDetail);
queryEntries = historyWrapper.find('#query_list .list-item');
queryDetail = historyWrapper.find('#query_detail');
});
describe('the history entries panel', () => {
it('has two query history entries', () => {
it('has two query history entries', (done) => {
expect(queryEntries.length).toBe(2);
done();
});
it('displays the query history entries in order', () => {
expect(queryEntries.at(0).text()).toContain('first sql statement');
expect(queryEntries.at(1).text()).toContain('second sql statement');
expect($(queryEntries[0]).text()).toContain('first sql statement');
expect($(queryEntries[1]).text()).toContain('second sql statement');
});
it('displays the formatted timestamp of the queries in chronological order by most recent first', () => {
expect(queryEntries.at(0).find('.timestamp').text()).toBe('14:03:15');
expect(queryEntries.at(1).find('.timestamp').text()).toBe('01:33:05');
expect($(queryEntries[0]).find('.timestamp').text()).toBe('14:03:15');
expect($(queryEntries[1]).find('.timestamp').text()).toBe('01:33:05');
});
it('renders the most recent query as selected', () => {
expect(queryEntries.at(0).getElements().length).toBe(1);
expect(queryEntries.at(0).render().hasClass('selected')).toBeTruthy();
expect($(queryEntries[0]).hasClass('selected')).toBeTruthy();
});
it('renders the older query as not selected', () => {
expect(queryEntries.at(1).getElements().length).toBe(1);
expect(queryEntries.at(1).render().hasClass('selected')).toBeFalsy();
expect(queryEntries.at(1).render().hasClass('error')).toBeTruthy();
});
describe('when the selected query is the most recent', () => {
describe('when we press arrow down', () => {
beforeEach(() => {
pressArrowDownKey(queryHistoryEntriesComponent.find('.list-item').at(0));
});
it('should select the next query', () => {
expect(queryEntries.at(1).getElements().length).toBe(1);
expect(queryEntries.at(1).render().hasClass('selected')).toBeTruthy();
});
it('should display the corresponding detail on the right pane', () => {
expect(queryDetail.at(0).render().text()).toContain('message from second sql query');
});
describe('when arrow down pressed again', () => {
it('should not change the selected query', () => {
pressArrowDownKey(queryHistoryEntriesComponent.find('.list-item').at(0));
expect(queryEntries.at(1).getElements().length).toBe(1);
expect(queryEntries.at(1).render().hasClass('selected')).toBeTruthy();
});
});
describe('when arrow up is pressed', () => {
beforeEach(() => {
pressArrowUpKey(queryHistoryEntriesComponent.find('.list-item').at(0));
});
it('should select the most recent query', () => {
expect(queryEntries.at(0).getElements().length).toBe(1);
expect(queryEntries.at(0).render().hasClass('selected')).toBeTruthy();
});
});
});
describe('when arrow up is pressed', () => {
beforeEach(() => {
pressArrowUpKey(queryHistoryEntriesComponent.find('.list-item').at(0));
});
it('should not change the selected query', () => {
expect(queryEntries.at(0).getElements().length).toBe(1);
expect(queryEntries.at(0).render().hasClass('selected')).toBeTruthy();
});
});
expect($(queryEntries[1]).hasClass('selected')).toBeFalsy();
expect($(queryEntries[1]).find('.entry').hasClass('error')).toBeTruthy();
});
});
@@ -185,29 +109,34 @@ describe('QueryHistory', () => {
copyAllButton = () => queryDetail.find('#history-detail-query > button');
});
it('should change preferences', ()=>{
historyComponent.setEditorPref(sqlEditorPref);
expect(queryDetail.find('#history-detail-query .CodeMirror').attr('style')).toBe('font-size: 1.5em;');
});
it('displays the formatted timestamp', () => {
expect(queryDetail.at(0).text()).toContain('6-3-17 14:03:15Date');
expect(queryDetail.text()).toContain('6-3-17 14:03:15');
});
it('displays the number of rows affected', () => {
if (/PhantomJS/.test(window.navigator.userAgent)) {
expect(queryDetail.at(0).text()).toContain('12345Rows Affected');
expect(queryDetail.text()).toContain('12345');
} else {
expect(queryDetail.at(0).text()).toContain('12,345Rows Affected');
expect(queryDetail.text()).toContain('12,345');
}
});
it('displays the total time', () => {
expect(queryDetail.at(0).text()).toContain('14 msecDuration');
expect(queryDetail.text()).toContain('14 msec');
});
it('displays the full message', () => {
expect(queryDetail.at(0).text()).toContain('message from first sql query');
expect(queryDetail.text()).toContain('message from first sql query');
});
it('displays first query SQL', (done) => {
setTimeout(() => {
expect(queryDetail.at(0).text()).toContain('first sql statement');
expect(queryDetail.text()).toContain('first sql statement');
done();
}, 1000);
});
@@ -215,7 +144,7 @@ describe('QueryHistory', () => {
describe('when the "Copy All" button is clicked', () => {
beforeEach(() => {
spyOn(clipboard, 'copyTextToClipboard');
copyAllButton().simulate('click');
copyAllButton().trigger('click');
});
it('copies the query to the clipboard', () => {
@@ -242,7 +171,7 @@ describe('QueryHistory', () => {
describe('when the copy button is clicked', () => {
beforeEach(() => {
copyAllButton().simulate('click');
copyAllButton().trigger('click');
});
describe('before 1.5 seconds', () => {
@@ -255,7 +184,7 @@ describe('QueryHistory', () => {
});
it('should have the class \'was-copied\'', () => {
expect(copyAllButton().render().hasClass('was-copied')).toBe(true);
expect(copyAllButton().hasClass('was-copied')).toBe(true);
});
});
@@ -272,7 +201,7 @@ describe('QueryHistory', () => {
describe('when is clicked again after 1s', () => {
beforeEach(() => {
jasmine.clock().tick(1000);
copyAllButton().simulate('click');
copyAllButton().trigger('click');
});
@@ -286,7 +215,7 @@ describe('QueryHistory', () => {
});
it('should have the class \'was-copied\'', () => {
expect(copyAllButton().render().hasClass('was-copied')).toBe(true);
expect(copyAllButton().hasClass('was-copied')).toBe(true);
});
});
@@ -307,76 +236,39 @@ describe('QueryHistory', () => {
let failedEntry;
beforeEach(() => {
failedEntry = queryEntries.at(1);
failedEntry.simulate('click');
failedEntry = $(queryEntries[1]);
failedEntry.trigger('click');
});
it('displays the error message on top of the details pane', () => {
expect(queryDetail.at(0).text()).toContain('Error Message message from second sql query');
expect(queryDetail.text()).toContain('Error Message message from second sql query');
});
});
});
describe('when the older query is clicked on', () => {
let firstEntry, secondEntry;
beforeEach(() => {
firstEntry = queryEntries.at(0);
secondEntry = queryEntries.at(1);
secondEntry.simulate('click');
firstEntry = $(queryEntries[0]);
secondEntry = $(queryEntries[1]);
secondEntry.trigger('click');
});
it('displays the query in the right pane', () => {
expect(queryDetail.at(0).text()).toContain('second sql statement');
expect(queryDetail.text()).toContain('second sql statement');
});
it('deselects the first history entry', () => {
expect(firstEntry.getElements().length).toBe(1);
expect(firstEntry.hasClass('selected')).toBeFalsy();
});
it('selects the second history entry', () => {
expect(secondEntry.getElements().length).toBe(1);
expect(secondEntry.render().hasClass('selected')).toBeTruthy();
expect(secondEntry.hasClass('selected')).toBeTruthy();
});
});
describe('when the first query is outside the visible area', () => {
beforeEach(() => {
isInvisibleSpy.and.callFake((element) => {
return element.textContent.contains('first sql statement');
});
});
describe('when the first query is the selected query', () => {
describe('when refocus function is called', () => {
let selectedListItem;
beforeEach(() => {
selectedListItem = ReactDOM.findDOMNode(historyWrapper.instance())
.getElementsByClassName('selected')[0].parentElement;
spyOn(selectedListItem, 'focus');
jasmine.clock().install();
});
afterEach(() => {
jasmine.clock().uninstall();
});
it('the first query scrolls into view', () => {
historyWrapper.instance().refocus();
expect(selectedListItem.focus).toHaveBeenCalledTimes(0);
jasmine.clock().tick(1);
expect(selectedListItem.focus).toHaveBeenCalledTimes(1);
});
});
});
});
describe('when a third SQL query is executed', () => {
beforeEach(() => {
historyCollection.add({
@@ -388,11 +280,11 @@ describe('QueryHistory', () => {
message: 'pretext ERROR: third sql message',
});
queryEntries = historyWrapper.find(QueryHistoryEntry);
queryEntries = historyWrapper.find('#query_list .list-item');
});
it('displays third query SQL in the right pane', () => {
expect(queryDetail.at(0).text()).toContain('third sql statement');
expect(queryDetail.text()).toContain('third sql statement');
});
});
@@ -407,33 +299,13 @@ describe('QueryHistory', () => {
message: 'ERROR: unexpected error from fourth sql message',
});
queryEntries = historyWrapper.find(QueryHistoryEntry);
queryEntries = historyWrapper.find('#query_list .list-item');
});
it('displays fourth query SQL in the right pane', () => {
expect(queryDetail.at(0).text()).toContain('Error Message unexpected error from fourth sql message');
expect(queryDetail.text()).toContain('Error Message unexpected error from fourth sql message');
});
});
describe('when a fifth SQL query is executed', () => {
beforeEach(() => {
historyCollection.add({
query: 'fifth sql statement',
start_time: new Date(2017, 12, 12, 1, 33, 5, 99),
status: false,
row_affected: 0,
total_time: '26 msec',
message: 'unknown error',
});
queryEntries = historyWrapper.find(QueryHistoryEntry);
});
it('displays fourth query SQL in the right pane', () => {
expect(queryDetail.at(0).text()).toContain('Error Message unknown error');
});
});
});
describe('when several days of queries were executed', () => {
@@ -482,16 +354,11 @@ describe('QueryHistory', () => {
}];
historyCollection = new HistoryCollection(historyObjects);
historyWrapper = mount(<QueryHistory historyCollection={historyCollection}
sqlEditorPref={sqlEditorPref}
/>);
historyComponent = new QueryHistory(historyWrapper, historyCollection);
historyComponent.render();
const queryHistoryEntriesComponent = historyWrapper.find(QueryHistoryEntries);
isInvisibleSpy = spyOn(queryHistoryEntriesComponent.instance(), 'isInvisible')
.and.returnValue(false);
queryEntries = queryHistoryEntriesComponent.find(QueryHistoryEntry);
queryEntryDateGroups = queryHistoryEntriesComponent.find(QueryHistoryEntryDateGroup);
queryEntries = historyWrapper.find('#query_list .list-item');
queryEntryDateGroups = historyWrapper.find('#query_list .query-group');
});
afterEach(() => {
@@ -504,23 +371,11 @@ describe('QueryHistory', () => {
});
it('has title above', () => {
expect(queryEntryDateGroups.at(0).text()).toBe('Today - Jul 01 2017');
expect(queryEntryDateGroups.at(1).text()).toBe('Yesterday - Jun 30 2017');
expect(queryEntryDateGroups.at(2).text()).toBe('Jun 28 2017');
expect($(queryEntryDateGroups[0]).find('.date-label').text()).toBe('Today - Jul 01 2017');
expect($(queryEntryDateGroups[1]).find('.date-label').text()).toBe('Yesterday - Jun 30 2017');
expect($(queryEntryDateGroups[2]).find('.date-label').text()).toBe('Jun 28 2017');
});
});
});
});
function pressArrowUpKey(node) {
pressKey(node, 38);
}
function pressArrowDownKey(node) {
pressKey(node, 40);
}
function pressKey(node, keyCode) {
node.simulate('keyDown', {keyCode: keyCode});
}
});