Add the capability to get browser console messages (closes #1738) #1818

AlexanderMoskovkin · 2017-09-26T16:07:48Z

Feature summary

API

const consoleMessages = await t.getBrowserConsoleMessages();

// returns arrays of messages in the browser console for...
// ...console.log()
const logs = consoleMessages.log;         // -> ['some log message 1', 'some log message 2']
// ...console.error()
const errors = consoleMessages.error;   // -> ['some error message'] 
// ...console.warn()
const warnings = consoleMessages.warn;   // -> ['some warning message'] 
// ...console.info()
const info = consoleMessages.info;   // -> ['some info message']

Some browsers can write messages to the console with a little bit different formatting. We just call toString() for arguments that were passed to the console methods (see an example in the test)

Real-World Use Case

Check your react application doesn't have prop type errors:

// check-prop-types.js
import { t } from 'testcafe';

export default async function () {
    const { error } = await t.getBrowserConsoleMessages();
        
    await t.expect(error[0]).notOk();
}

// test.js
import { Selector } from 'testcafe';
import checkPropTypes from './check-prop-types';

fixture `react example`
    .page `http://localhost:8080/`  // https://github.com/mzabriskie/react-example
    .afterEach(() => checkPropTypes());

test('test', async t => {
    await t
        .typeText(Selector('.form-control'), 'devexpress')
        .click(Selector('button').withText('Go'))
        .click(Selector('h4').withText('Organizations'));
});

testcafe-build-bot · 2017-09-26T16:31:29Z

❌ Tests for the commit 568cb32 have failed. See details:

VasilyStrelyaev · 2017-09-26T16:28:20Z

ts-defs/index.d.ts

+interface ConsoleMessagesCollection {
+    /**
+     * TODO:
+     */


/** * Messages output to the browser console by the console.log() method. */

VasilyStrelyaev · 2017-09-26T16:29:46Z

ts-defs/index.d.ts

+    log: string[],
+    /**
+     * TODO:
+     */


/** * Warning messages output to the browser console by the console.warn() method. */

VasilyStrelyaev · 2017-09-26T16:30:22Z

ts-defs/index.d.ts

+    /**
+     * TODO:
+     */
+    error: string[],


/** * Error messages output to the browser console by the console.error() method. */

VasilyStrelyaev · 2017-09-26T16:30:51Z

ts-defs/index.d.ts

+    /**
+     * TODO:
+     */
+    info: string[]


/** * Information messages output to the browser console by the console.info() method. */

VasilyStrelyaev · 2017-09-26T16:43:17Z

ts-defs/index.d.ts

@@ -1005,6 +1024,10 @@ interface TestController {
     */
    getNativeDialogHistory(): Promise<NativeDialogHistoryItem[]>;
    /**
+     * TODO: Returns a collection of browser console messages.
+     */


/** * Returns an object that contains messages output to the browser console. * * This object exposes the following properties. * * -- `log` contains log messages written by the console.log() method * -- `error` contains error messages written by the console.error() method * -- `warn` contains warning messages written by the console.warn() method * -- `info` contains information messages written by the console.info() method */

Do we need to list the return object's properties here? If not, just remove them.

AlexanderMoskovkin · 2017-09-27T18:15:36Z

FPR

/cc @helen-dikareva @AndreyBelym @VasilyStrelyaev

testcafe-build-bot · 2017-09-27T18:29:21Z

❌ Tests for the commit e70563e have failed. See details:

helen-dikareva · 2017-09-28T08:36:34Z

test/functional/fixtures/api/es-next/console/testcafe-fixtures/console-test.js

@@ -0,0 +1,39 @@
+fixture `Double Click`;


let's rename fixture

helen-dikareva · 2017-09-28T08:42:56Z

test/server/data/test-suites/typescript-defs/test-controller.ts

@@ -1,6 +1,6 @@
 /// <reference path="../../../../../ts-defs/index.d.ts" />
-import { Selector, ClientFunction } from 'testcafe';
-import { expect } from 'chai';
+import {Selector, ClientFunction} from 'testcafe';


wrong formating

AndreyBelym

lgtm

testcafe-build-bot · 2017-09-28T11:40:32Z

❌ Tests for the commit 9889217 have failed. See details:

inikulin · 2017-09-28T11:53:13Z

src/client/driver/driver.js

+    }
+
+    set consoleMessages (messages) {
+        return this.contextStorage.setItem(CONSOLE_MESSAGES, messages);


Ehmm, we can run out of storage quite quickly with this approach

Thought about this.. Now the max size of the session storage in browsers is 5-10MB, so it looks not so crusial since we reset the session storage for each test run. But I agree, it would be better to keep the messages on the server.

testcafe-build-bot · 2017-09-28T12:02:35Z

✅ Tests for the commit 9889217 have passed. See details:

testcafe-build-bot · 2017-10-03T15:49:03Z

✅ Tests for the commit e970116 have passed. See details:

…#1738)

AlexanderMoskovkin · 2017-10-04T14:13:41Z

FPR /cc @helen-dikareva @AndreyBelym @inikulin

testcafe-build-bot · 2017-10-04T14:29:32Z

❌ Tests for the commit c4358a6 have failed. See details:

AndreyBelym

lgtm

testcafe-build-bot · 2017-10-04T14:50:05Z

❌ Tests for the commit c4358a6 have failed. See details:

markusguenther · 2018-02-10T20:10:52Z

Thanks for that adjustment 👍

…#1738) (DevExpress#1818) * Add the capability to get browser console messages (closes DevExpress#1738) * Rename to `getBrowserConsoleMessages` * Address Helen's remarks * Fix the test for node 4 * Store messages on the server * Integrating with Roles. Refactoring. * Fix tests.

AlexanderMoskovkin force-pushed the gh-1738 branch from d965b8e to 568cb32 Compare September 26, 2017 16:08

VasilyStrelyaev reviewed Sep 26, 2017

View reviewed changes

AlexanderMoskovkin changed the title ~~[WIP] Add the capability to get browser console messages (closes #1738)~~ Add the capability to get browser console messages (closes #1738) Sep 27, 2017

AlexanderMoskovkin requested review from AndreyBelym, VasilyStrelyaev and helen-dikareva September 27, 2017 18:16

helen-dikareva reviewed Sep 28, 2017

View reviewed changes

AndreyBelym approved these changes Sep 28, 2017

View reviewed changes

VasilyStrelyaev approved these changes Sep 28, 2017

View reviewed changes

helen-dikareva approved these changes Sep 28, 2017

View reviewed changes

inikulin suggested changes Sep 28, 2017

View reviewed changes

AlexanderMoskovkin added 7 commits October 4, 2017 16:58

Add the capability to get browser console messages (closes DevExpress…

8413a1b

…#1738)

Rename to getBrowserConsoleMessages

ea07015

Address Helen's remarks

29dc3df

Fix the test for node 4

f3c6929

Store messages on the server

709ce55

Integrating with Roles. Refactoring.

d8209ff

Fix tests.

c4358a6

AlexanderMoskovkin force-pushed the gh-1738 branch from 6b90e32 to c4358a6 Compare October 4, 2017 13:59

AndreyBelym approved these changes Oct 4, 2017

View reviewed changes

helen-dikareva approved these changes Oct 4, 2017

View reviewed changes

AlexanderMoskovkin merged commit 7dc8cd4 into DevExpress:master Oct 9, 2017

Farfurix mentioned this pull request Aug 29, 2018

Babel: use for...of transform for client scripts #2783

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add the capability to get browser console messages (closes #1738) #1818

Add the capability to get browser console messages (closes #1738) #1818

AlexanderMoskovkin commented Sep 26, 2017 •

edited

Loading

testcafe-build-bot commented Sep 26, 2017

VasilyStrelyaev Sep 26, 2017

VasilyStrelyaev Sep 26, 2017

VasilyStrelyaev Sep 26, 2017

VasilyStrelyaev Sep 26, 2017

VasilyStrelyaev Sep 26, 2017

VasilyStrelyaev Sep 26, 2017

AlexanderMoskovkin commented Sep 27, 2017

testcafe-build-bot commented Sep 27, 2017

helen-dikareva Sep 28, 2017

helen-dikareva Sep 28, 2017

AndreyBelym left a comment

testcafe-build-bot commented Sep 28, 2017

inikulin Sep 28, 2017

AlexanderMoskovkin Sep 28, 2017

testcafe-build-bot commented Sep 28, 2017

testcafe-build-bot commented Oct 3, 2017

AlexanderMoskovkin commented Oct 4, 2017

testcafe-build-bot commented Oct 4, 2017

AndreyBelym left a comment

testcafe-build-bot commented Oct 4, 2017

markusguenther commented Feb 10, 2018

Add the capability to get browser console messages (closes #1738) #1818

Add the capability to get browser console messages (closes #1738) #1818

Conversation

AlexanderMoskovkin commented Sep 26, 2017 • edited Loading

Feature summary

API

Real-World Use Case

testcafe-build-bot commented Sep 26, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

AlexanderMoskovkin commented Sep 27, 2017

testcafe-build-bot commented Sep 27, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

AndreyBelym left a comment

Choose a reason for hiding this comment

testcafe-build-bot commented Sep 28, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

testcafe-build-bot commented Sep 28, 2017

testcafe-build-bot commented Oct 3, 2017

AlexanderMoskovkin commented Oct 4, 2017

testcafe-build-bot commented Oct 4, 2017

AndreyBelym left a comment

Choose a reason for hiding this comment

testcafe-build-bot commented Oct 4, 2017

markusguenther commented Feb 10, 2018

AlexanderMoskovkin commented Sep 26, 2017 •

edited

Loading