Remove Chrome Logger and update Cypress and Percy (#4354)

.circleci/docker-compose.cypress.yml

@@ -2,7 +2,7 @@ version: '3'
 services:
   server:
     build: ../
-    command: dev_server
+    command: server
     depends_on:
       - postgres
       - redis

client/app/assets/less/inc/misc.less

@@ -234,4 +234,9 @@
     .hide-in-percy, .pace {
         visibility: hidden;
     }
+
+    // hide tooltips in Percy
+    .ant-tooltip {
+        display: none !important;
+    }
 }

client/app/components/ParameterApplyButton.jsx

@@ -12,7 +12,7 @@ function ParameterApplyButton({ paramCount, onClick }) {
   return (
     <div className="parameter-apply-button" data-show={!!paramCount} data-test="ParameterApplyButton">
       <Badge count={paramCount}>
-        <Tooltip title={`${KeyboardShortcuts.modKey} + Enter`}>
+        <Tooltip title={paramCount ? `${KeyboardShortcuts.modKey} + Enter` : null}>
           <span>
             <Button onClick={onClick}>
               <i className={`fa fa-${icon}`} /> Apply Changes

client/cypress/integration/dashboard/sharing_spec.js

@@ -112,6 +112,7 @@ describe('Dashboard Sharing', () => {
         createQueryAndAddWidget(this.dashboardId, unsafeQueryData, { position: secondWidgetPos }).then(() => {
           cy.visit(this.dashboardUrl);
           cy.logout();
+          cy.title().should('eq', 'Login to Redash'); // Make sure it's logged out
           cy.visit(secretAddress);
           cy.getByTestId('TableVisualization', { timeout: 10000 }).should('exist');
           cy.contains('.alert', 'This query contains potentially unsafe parameters' +

client/cypress/integration/query/parameter_spec.js

@@ -247,7 +247,7 @@ describe('Parameter', () => {
     const selectCalendarDate = (date) => {
       cy.getByTestId('ParameterName-test-parameter')
         .find('input')
-        .click({ force: true });
+        .click();
 
       cy.get('.ant-calendar-date-panel')
         .contains('.ant-calendar-date', date)
@@ -337,7 +337,7 @@ describe('Parameter', () => {
       cy.getByTestId('ParameterName-test-parameter')
         .find('input')
         .as('Input')
-        .click({ force: true });
+        .click();
 
       cy.get('.ant-calendar-date-panel')
         .contains('.ant-calendar-date', '15')
@@ -357,7 +357,7 @@ describe('Parameter', () => {
       cy.getByTestId('ParameterName-test-parameter')
         .find('input')
         .as('Input')
-        .click({ force: true });
+        .click();
 
       cy.get('.ant-calendar-date-panel')
         .contains('Now')
@@ -389,7 +389,7 @@ describe('Parameter', () => {
       expectDirtyStateChange(() => {
         cy.getByTestId('ParameterName-test-parameter')
           .find('input')
-          .click({ force: true });
+          .click();
 
         cy.get('.ant-calendar-date-panel')
           .contains('Now')
@@ -403,7 +403,7 @@ describe('Parameter', () => {
       cy.getByTestId('ParameterName-test-parameter')
         .find('input')
         .first()
-        .click({ force: true });
+        .click();
 
       cy.get('.ant-calendar-date-panel')
         .contains('.ant-calendar-date', startDate)

client/cypress/integration/visualizations/pivot_spec.js

@@ -97,7 +97,7 @@ describe('Pivot', () => {
           .get('.ace_text-input')
           .first()
           .focus()
-          .type(" UNION ALL\nSELECT 'c' AS stage1, 'c5' AS stage2, 55 AS value");
+          .type(" UNION ALL {enter}SELECT 'c' AS stage1, 'c5' AS stage2, 55 AS value");
         cy.getByTestId('SaveButton').click();
         cy.getByTestId('ExecuteButton').click();
 

client/cypress/plugins/index.js

@@ -1 +1,5 @@
-module.exports = () => {};
+const percyHealthCheck = require('@percy/cypress/task'); // eslint-disable-line import/no-extraneous-dependencies, import/no-unresolved
+
+module.exports = (on) => {
+  on('task', percyHealthCheck);
+};

package.json

@@ -4,7 +4,7 @@
   "description": "The frontend part of Redash.",
   "main": "index.js",
   "scripts": {
-    "start": "node --max-http-header-size=16385 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js",
+    "start": "webpack-dev-server",
     "bundle": "bin/bundle-extensions",
     "clean": "rm -rf ./client/dist/",
     "build": "npm run clean && NODE_ENV=production node --max-old-space-size=4096 node_modules/.bin/webpack",
@@ -16,7 +16,7 @@
     "lint:ci": "npm run lint -- --format junit --output-file /tmp/test-results/eslint/results.xml",
     "test": "TZ=Africa/Khartoum jest",
     "test:watch": "jest --watch",
-    "cypress:install": "npm install --no-save cypress@3.4.1 @percy/cypress@^0.2.3 atob@2.1.2",
+    "cypress:install": "npm install --no-save cypress@~3.6.1 @percy/cypress@^2.2.0 atob@2.1.2",
     "cypress": "node client/cypress/cypress.js"
   },
   "repository": {

redash/app.py

@@ -21,7 +21,6 @@ class Redash(Flask):
 
 def create_app():
     from . import authentication, extensions, handlers, limiter, mail, migrate, security
-    from .handlers import chrome_logger
     from .handlers.webpack import configure_webpack
     from .metrics import request as request_metrics
     from .models import db, users
@@ -44,7 +43,6 @@ def create_app():
     handlers.init_app(app)
     configure_webpack(app)
     extensions.init_app(app)
-    chrome_logger.init_app(app)
     users.init_app(app)
 
     return app

redash/handlers/chrome_logger.py

@@ -1,54 +0,0 @@
-import time
-import chromelogger
-from flask import g, request
-from flask_sqlalchemy import get_debug_queries
-
-
-def log_queries():
-    total_duration = 0.0
-    queries_count = 0
-
-    chromelogger.group("SQL Queries")
-
-    for q in get_debug_queries():
-        total_duration += q.duration
-        queries_count += 1
-        chromelogger.info(q.statement % q.parameters)
-        chromelogger.info("Runtime: {:.2f}ms".format(1000 * q.duration))
-
-    chromelogger.info("{} queries executed in {:.2f}ms.".format(queries_count, total_duration*1000))
-
-    chromelogger.group_end("SQL Queries")
-
-
-def chrome_log(response):
-    request_duration = (time.time() - g.start_time) * 1000
-    queries_duration = g.get('queries_duration', 0.0)
-    queries_count = g.get('queries_count', 0)
-
-    group_name = '{} {} ({}, {:.2f}ms runtime, {} queries in {:.2f}ms)'.format(
-        request.method, request.path, response.status_code, request_duration, queries_count, queries_duration)
-
-    chromelogger.group_collapsed(group_name)
-
-    endpoint = (request.endpoint or 'unknown').replace('.', '_')
-    chromelogger.info('Endpoint: {}'.format(endpoint))
-    chromelogger.info('Content Type: {}'.format(response.content_type))
-    chromelogger.info('Content Length: {}'.format(response.content_length or -1))
-
-    log_queries()
-
-    chromelogger.group_end(group_name)
-
-    header = chromelogger.get_header()
-    if header is not None:
-        response.headers.add(*header)
-
-    return response
-
-
-def init_app(app):
-    if not app.debug:
-        return
-
-    app.after_request(chrome_log)

requirements.txt

@@ -55,7 +55,6 @@ simplejson==3.16.0
 ua-parser==0.8.0
 user-agents==2.0
 maxminddb-geolite2==2018.703
-chromelogger==0.4.3
 pypd==1.1.0
 disposable-email-domains>=0.0.52
 gevent==1.4.0