- Merge remote-tracking branch 'origin/dev'

- update renderer artifacts - stricten dash dependencies versions
plotly · Jan 14, 2020 · c2d6dce · c2d6dce
2 parents 904f0e3 + a9db3a0
commit c2d6dce
Show file tree

Hide file tree

Showing 30 changed files with 659 additions and 254 deletions.
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
@@ -1,5 +1,5 @@
 # These owners will be the default owners for everything in
 # the repo. Unless a later match takes precedence
-* @alexcjohnson @byronz @Marc-Andre-Rivet
+* @alexcjohnson @Marc-Andre-Rivet
 
-_r_*     @alexcjohnson @byronz @Marc-Andre-Rivet @rpkyle
+_r_*     @alexcjohnson @Marc-Andre-Rivet @rpkyle
diff --git a/.gitignore b/.gitignore
@@ -14,6 +14,7 @@ venv/
 ENV/
 env.bak/
 venv.bak/
+vv
 
 # IDE
 .idea/*
@@ -64,4 +65,4 @@ npm-debug*
 
 dash_renderer/
 digest.json
-VERSION.txt
+VERSION.txt
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,42 @@
 All notable changes to `dash` will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## [1.8.0] - 2020-01-14
+### Added
+- [#1073](https://github.com/plotly/dash/pull/1073) Two new functions to simplify usage handling URLs and pathnames: `app.get_relative_path` & `app.trim_relative_path`.
+These functions are particularly useful for apps deployed on Dash Enterprise where the apps served under a URL prefix (the app name) which is unlike apps served on localhost:8050.
+    - `app.get_relative_path` returns a path with the config setting `requests_pathname_prefix` prefixed. Use `app.get_relative_path` anywhere you would provide a relative pathname, like `dcc.Link(href=app.relative_path('/page-2'))` or even as an alternative to `app.get_asset_url` with e.g. `html.Img(src=app.get_relative_path('/assets/logo.png'))`.
+    - `app.trim_relative_path` a path with `requests_pathname_prefix` and leading & trailing
+    slashes stripped from it. Use this function in callbacks that deal with `dcc.Location` `pathname`
+    routing.
+    Example usage:
+    ```python
+    app.layout = html.Div([
+        dcc.Location(id='url'),
+        html.Div(id='content')
+    ])
+    @app.callback(Output('content', 'children'), [Input('url', 'pathname')])
+    def display_content(path):
+        page_name = app.strip_relative_path(path)
+        if not page_name:  # None or ''
+            return html.Div([
+                html.Img(src=app.get_relative_path('/assets/logo.png')),
+                dcc.Link(href=app.get_relative_path('/page-1')),
+                dcc.Link(href=app.get_relative_path('/page-2')),
+            ])
+        elif page_name == 'page-1':
+            return chapters.page_1
+        if page_name == "page-2":
+            return chapters.page_2
+    ```
+
+### Changed
+- [#1035](https://github.com/plotly/dash/pull/1035) Simplify our build process.
+- [#1074](https://github.com/plotly/dash/pull/1045) Error messages when providing an incorrect property to a component have been improved: they now specify the component type, library, version, and ID (if available).
+
+### Fixed
+- [#1037](https://github.com/plotly/dash/pull/1037) Fix no_update test to allow copies, such as those stored and retrieved from a cache.
+
 ## [1.7.0] - 2019-11-27
 ### Added
 - [#967](https://github.com/plotly/dash/pull/967) Add support for defining

diff --git a/dash-renderer/dash_renderer/__init__.py b/dash-renderer/dash_renderer/__init__.py
@@ -1,7 +1,7 @@
 import sys
 
 __file__
-__version__ = "1.2.2"
+__version__ = "1.2.3"
 
 _js_dist_dependencies = [
     {
@@ -42,7 +42,7 @@
     {
         "relative_package_path": "{}.min.js".format(__name__),
         "dev_package_path": "{}.dev.js".format(__name__),
-        "external_url": "https://unpkg.com/dash-renderer@1.2.2"
+        "external_url": "https://unpkg.com/dash-renderer@1.2.3"
         "/dash_renderer/dash_renderer.min.js",
         "namespace": "dash_renderer",
     },

diff --git a/dash-renderer/dash_renderer/dash_renderer.dev.js b/dash-renderer/dash_renderer/dash_renderer.dev.js
diff --git a/dash-renderer/dash_renderer/dash_renderer.min.js b/dash-renderer/dash_renderer/dash_renderer.min.js
diff --git a/dash-renderer/digest.json b/dash-renderer/digest.json
@@ -1,12 +1,12 @@
 {
-    "MD5 (dash_renderer.dev.js)":"9f94b1dfda81223a2f277573cc4d34af",
-    "MD5 (dash_renderer.min.js)":"50050e60b65a8982d75e83b7760324dd",
+    "MD5 (dash_renderer.dev.js)":"561787639c4e4e6dfc2ed334f8b9c08e",
+    "MD5 (dash_renderer.min.js)":"b89f7fc48aecc81250a3a002f0f0a5a0",
     "MD5 (polyfill@7.7.0.min.js)":"ed6472b73ae010eee88282933a04c2a1",
     "MD5 (prop-types@15.7.2.js)":"85947944e396a28895fad5f553eee36f",
     "MD5 (prop-types@15.7.2.min.js)":"e3053393609bd2744010498629a43597",
     "MD5 (react-dom@16.8.6.js)":"d7f8afaf3370a228c8d5c802c9d9a102",
     "MD5 (react-dom@16.8.6.min.js)":"fad5842bd019c3878795ec52059f47fc",
     "MD5 (react@16.8.6.js)":"bb95f4cd851114c374c3858e9c51da10",
     "MD5 (react@16.8.6.min.js)":"f808b8e8ab51b0d9525795db3768cd86",
-    "dash-renderer":"1.2.2"
+    "dash-renderer":"1.2.3"
 }
diff --git a/dash-renderer/package-lock.json b/dash-renderer/package-lock.json
diff --git a/dash-renderer/package.json b/dash-renderer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "dash-renderer",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "description": "render dash components in react",
   "main": "dash_renderer/dash_renderer.min.js",
   "scripts": {
@@ -23,7 +23,6 @@
     "react": "16.8.6",
     "react-dom": "16.8.6",
     "prop-types": "15.7.2",
-    "check-prop-types": "1.1.2",
     "cookie": "^0.3.1",
     "dependency-graph": "^0.5.0",
     "radium": "^0.22.1",
@@ -32,7 +31,6 @@
     "redux": "^3.4.0",
     "redux-actions": "^0.9.1",
     "redux-thunk": "^2.0.1",
-    "uniqid": "^5.0.3",
     "viz.js": "1.8.0"
   },
   "devDependencies": {
@@ -59,7 +57,6 @@
     "prettier-eslint": "^8.8.2",
     "prettier-eslint-cli": "^4.7.1",
     "prettier-stylelint": "^0.4.2",
-    "raw-loader": "^3.1.0",
     "style-loader": "^1.0.0",
     "webpack": "^4.39.3",
     "webpack-cli": "^3.3.8",

diff --git a/dash-renderer/src/TreeContainer.js b/dash-renderer/src/TreeContainer.js
@@ -25,7 +25,7 @@ import {notifyObservers, updateProps} from './actions';
 import isSimpleComponent from './isSimpleComponent';
 import {recordUiEdit} from './persistence';
 import ComponentErrorBoundary from './components/error/ComponentErrorBoundary.react';
-import checkPropTypes from 'check-prop-types';
+import checkPropTypes from './checkPropTypes';
 
 function validateComponent(componentDefinition) {
     if (type(componentDefinition) === 'Array') {

diff --git a/dash-renderer/src/checkPropTypes.js b/dash-renderer/src/checkPropTypes.js
@@ -0,0 +1,88 @@
+/*
+ * Copied out of prop-types and modified - inspired by check-prop-types, but
+ * simplified and tweaked to our needs: we don't need the NODE_ENV check,
+ * we report all errors, not just the first one, and we don't need the throwing
+ * variant `assertPropTypes`.
+ */
+import ReactPropTypesSecret from 'prop-types/lib/ReactPropTypesSecret';
+
+/**
+ * Assert that the values match with the type specs.
+ *
+ * @param {object} typeSpecs Map of name to a ReactPropType
+ * @param {object} values Runtime values that need to be type-checked
+ * @param {string} location e.g. "prop", "context", "child context"
+ * @param {string} componentName Name of the component for error messages.
+ * @param {?Function} getStack Returns the component stack.
+ * @return {string} Any error messsage resulting from checking the types
+ */
+export default function checkPropTypes(
+    typeSpecs,
+    values,
+    location,
+    componentName,
+    getStack
+) {
+    const errors = [];
+    for (const typeSpecName in typeSpecs) {
+        if (typeSpecs.hasOwnProperty(typeSpecName)) {
+            let error;
+            // Prop type validation may throw. In case they do, we don't want to
+            // fail the render phase where it didn't fail before. So we log it.
+            // After these have been cleaned up, we'll let them throw.
+            try {
+                // This is intentionally an invariant that gets caught. It's the same
+                // behavior as without this statement except with a better message.
+                if (typeof typeSpecs[typeSpecName] !== 'function') {
+                    error = Error(
+                        (componentName || 'React class') +
+                            ': ' +
+                            location +
+                            ' type `' +
+                            typeSpecName +
+                            '` is invalid; ' +
+                            'it must be a function, usually from the `prop-types` package, but received `' +
+                            typeof typeSpecs[typeSpecName] +
+                            '`.'
+                    );
+                    error.name = 'Invariant Violation';
+                } else {
+                    error = typeSpecs[typeSpecName](
+                        values,
+                        typeSpecName,
+                        componentName,
+                        location,
+                        null,
+                        ReactPropTypesSecret
+                    );
+                }
+            } catch (ex) {
+                error = ex;
+            }
+            if (error && !(error instanceof Error)) {
+                errors.push(
+                    (componentName || 'React class') +
+                        ': type specification of ' +
+                        location +
+                        ' `' +
+                        typeSpecName +
+                        '` is invalid; the type checker ' +
+                        'function must return `null` or an `Error` but returned a ' +
+                        typeof error +
+                        '. ' +
+                        'You may have forgotten to pass an argument to the type checker ' +
+                        'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +
+                        'shape all require an argument).'
+                );
+            }
+            if (error instanceof Error) {
+                var stack = (getStack && getStack()) || '';
+
+                errors.push(
+                    'Failed ' + location + ' type: ' + error.message + stack
+                );
+            }
+        }
+    }
+    return errors.join('\n\n');
+}
diff --git a/dash-renderer/src/components/error/ComponentErrorBoundary.react.js b/dash-renderer/src/components/error/ComponentErrorBoundary.react.js
@@ -2,15 +2,13 @@ import {connect} from 'react-redux';
 import {Component} from 'react';
 import PropTypes from 'prop-types';
 import Radium from 'radium';
-import uniqid from 'uniqid';
 import {onError, revert} from '../../actions';
 
 class UnconnectedComponentErrorBoundary extends Component {
     constructor(props) {
         super(props);
         this.state = {
             myID: props.componentId,
-            myUID: uniqid(),
             oldChildren: null,
             hasError: false,
         };
@@ -24,7 +22,6 @@ class UnconnectedComponentErrorBoundary extends Component {
         const {dispatch} = this.props;
         dispatch(
             onError({
-                myUID: this.state.myUID,
                 myID: this.state.myID,
                 type: 'frontEnd',
                 error,

diff --git a/dash-renderer/src/components/error/FrontEnd/FrontEndError.css b/dash-renderer/src/components/error/FrontEnd/FrontEndError.css
@@ -114,3 +114,12 @@
     overflow: hidden;
     display: inline-block;
 }
+
+.dash-be-error__str {
+    background-color: #fdf3f4;
+    min-width: 386px;
+    max-width: 650px;
+    overflow: auto;
+    display: inline-block;
+    white-space: pre-wrap;
+}
diff --git a/dash-renderer/src/components/error/FrontEnd/FrontEndError.react.js b/dash-renderer/src/components/error/FrontEnd/FrontEndError.react.js
@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import '../Percy.css';
 import {urlBase} from '../../../utils';
 
-import werkzeugCss from '../werkzeug.css.txt';
+import werkzeugCss from '../werkzeugcss';
 
 class FrontEndError extends Component {
     constructor(props) {
@@ -108,7 +108,9 @@ function UnconnectedErrorContent({error, base}) {
                 </div>
             )}
             {/* Backend Error */}
-            {typeof error.html !== 'string' ? null : (
+            {typeof error.html !== 'string' ? null : error.html.indexOf(
+                  '<!DOCTYPE HTML'
+              ) === 0 ? (
                 <div className="dash-be-error__st">
                     <div className="dash-backend-error">
                         {/* Embed werkzeug debugger in an iframe to prevent
@@ -140,6 +142,10 @@ function UnconnectedErrorContent({error, base}) {
                         />
                     </div>
                 </div>
+            ) : (
+                <div className="dash-be-error__str">
+                    <div className="dash-backend-error">{error.html}</div>
+                </div>
             )}
         </div>
     );
@@ -167,7 +173,6 @@ const ErrorContent = connect(state => ({base: urlBase(state.config)}))(
 
 FrontEndError.propTypes = {
     e: PropTypes.shape({
-        myUID: PropTypes.string,
         timestamp: PropTypes.object,
         error: errorPropTypes,
     }),

diff --git a/...rer/src/components/error/werkzeug.css.txt → ...derer/src/components/error/werkzeugcss.js b/...rer/src/components/error/werkzeug.css.txt → ...derer/src/components/error/werkzeugcss.js
@@ -1,3 +1,7 @@
+// Werkzeug css included as a string, because we want to inject
+// it into an iframe srcDoc
+
+export default `
 body {
     margin: 0px;
     margin-top: 10px;
@@ -102,3 +106,4 @@ div.debugger {
 .debugger .traceback .source pre.line img {
     display: none;
 }
+`;
diff --git a/dash-renderer/src/persistence.js b/dash-renderer/src/persistence.js
@@ -66,7 +66,6 @@ import {
     type,
 } from 'ramda';
 import {createAction} from 'redux-actions';
-import uniqid from 'uniqid';
 
 import Registry from './registry';
 
@@ -81,7 +80,6 @@ function err(e) {
     /* eslint-disable no-console */
 
     return createAction('ON_ERROR')({
-        myUID: uniqid(),
         myID: storePrefix,
         type: 'frontEnd',
         error,