Merge branch 'dev' into persistence

Author: alexcjohnson

.github/CODEOWNERS

@@ -0,0 +1,3 @@
+# These owners will be the default owners for everything in
+# the repo. Unless a later match takes precedence
+* @alexcjohnson @byronz @Marc-Andre-Rivet

CHANGELOG.md

@@ -2,6 +2,11 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## Unreleased
+### Fixed
+
+- Fixed an infinite loop problem when `Graph` is wrapped by `Loading` component [#608](https://github.com/plotly/dash-core-components/issues/608)
+
 ## [1.1.2] - 2019-08-27
 ### Fixed
 - Fixed problems with `Graph` components leaking events and being recreated multiple times if declared with no ID [#604](https://github.com/plotly/dash-core-components/pull/604)

CONTRIBUTING.md

@@ -16,6 +16,13 @@ Please lint any additions to react components with `npm run lint`. Rules defined
 
 Use the [GitHub flow][] when proposing contributions to this repository (i.e. create a feature branch and submit a PR against the master branch).
 
+## Making a Contribution
+_For larger features, your contribution will have a higher likelihood of getting merged if you create an issue to discuss the changes that you'd like to make before you create a pull request._
+
+1. Create a pull request.
+2. After a review has been done and your changes have been approved, they will be merged and included in a future release of Dash.
+3. If significant enough, you have created an issue about documenting the new feature or change and you have added it to the [dash-docs](https://github.com/plotly/dash-docs) project.
+
 ## Running the Tests
 
 In order to run the tests, you first need to have built the JavaScript
@@ -24,33 +31,6 @@ you've pulled from upstream otherwise you may be running with an out of date
 `bundle.js`. See the instructions for building `bundle.js` in the [Testing
 Locally](README.md#testing-locally) section of README.md.
 
-## Publishing New Components/Features
-
-For now, multiple steps are necessary for publishing to NPM and PyPi,
-respectively. TODO:
-[#5](https://github.com/plotly/dash-components-archetype/issues/5) will roll up publishing steps into one workflow.
-
-1. Create a pull request and tag the Plotly team (`@plotly/dash`) as well as an appropriate reviewer (frequent [contributors][] are a safe bet).
-2. After a review has been done and your changes have been approved, create a prerelease and comment in the PR. Version numbers should follow [semantic versioning][]. To create a prerelease:
-    * Add `rc1` to `version.py` (`./dash_core_components/version.py`) e.g. `0.13.0rc1`
-    * Add `-rc1` to `package.json` e.g. `0.13.0-rc1`
-    * Update the `unpkg` link in `./dash_core_components/__init__.py`, replacing `__version__` with your release candidate (e.g. `"0.13.0-rc1"`)
-    * Run `npm run publish-all`.
-        - If needed, ask @chriddyp to get NPM / PyPi package publishing access.
-        - If the `publish-all` script fails on the `twine` command, try running
-            ```sh
-            twine upload dist/dash_core_components-X.X.X.tar.gz # where xx.x.x is the version number
-            ```
-3. Comment in the PR with the prerelease version
-4. Update the top-level comment to include info about how to install, a summary of the changes, and a simple example. For a good example, see the [Confirmation Modal component][].
-    * This makes it easier for a community member to come in and try it out. As more folks review, it's harder to find the installation instructions deep in the PR
-    * Keep this top-level comment updated with installation instructions (e.g. the `pip install` command)
-5. Make a post in the [Dash Community Forum][]
-    * Title it `":mega: Announcement! New <Your Feature> - Feedback Welcome"`
-    * In the description, link to the PR and any relevant issue(s)
-    * Pin the topic so that it appears at the top of the forum for two weeks
-    * For a good example, see the [Confirmation Modal announcement][]
-
 ## Updating Plotly.js
 
 1. Download the latest plotly.js from the cdn: `$ wget https://github.com/plotly/plotly.js/releases/tag/v1.49.4`

LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2019 Plotly Technologies
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

LICENSE

@@ -17,7 +17,7 @@ But, in order to do development locally, you need to install `dash` before every
 # python 2
 $ pip install virtualenv --user && virtualenv venv && . venv/bin/activate
 # python 3
-$ python -m venv && . venv/bin/activate
+$ python -m venv venv && . venv/bin/activate
 
 # make sure dash is installed with dev and testing dependencies
 $ pip install dash[dev,testing]  # in some shells you need \ to escape []
@@ -85,3 +85,7 @@ See the [dash-component-boilerplate](https://github.com/plotly/dash-component-bo
 [Dash Component Boilerplate]: (https://github.com/plotly/dash-component-boilerplate)
 [NPM package authors]: https://www.npmjs.com/package/dash-core-components/access
 [PyPi]: https://pypi.python.org/pypi
+
+
+## Big Thanks
+Cross-browser Testing Powered by [![image](https://user-images.githubusercontent.com/1394467/64290307-e4c66600-cf33-11e9-85a1-12c82230a597.png)](https://saucelabs.com) 

LICENSE.txt

@@ -12,8 +12,6 @@
   "homepage": "https://github.com/plotly/dash-core-components",
   "main": "dash_core_components/dash_core_components.min.js",
   "scripts": {
-    "prepare": "npm run build",
-    "publish-all": "node scripts/publish.js",
     "start": "webpack-serve ./webpack.serve.config.js --open",
     "lint": "eslint src tests",
     "lint:py": "flake8 --ignore=E501,F401,F841,F811,W503 tests",

README.md

@@ -1,6 +1,6 @@
 import React, {Component} from 'react';
 import PropTypes from 'prop-types';
-import {contains, filter, clone, has, isNil, type, omit} from 'ramda';
+import {contains, filter, clone, has, isNil, type, omit, equals} from 'ramda';
 /* global Plotly:true */
 
 const filterEventData = (gd, eventData, event) => {
@@ -83,7 +83,6 @@ class PlotlyGraph extends Component {
     plot(props) {
         const {figure, animate, animation_options, config} = props;
         const gd = this.gd.current;
-
         if (
             animate &&
             this._hasPlotted &&
@@ -98,7 +97,6 @@ class PlotlyGraph extends Component {
             config: config,
         }).then(() => {
             const gd = this.gd.current;
-
             // double-check gd hasn't been unmounted
             if (!gd) {
                 return;
@@ -154,7 +152,14 @@ class PlotlyGraph extends Component {
     }
 
     bindEvents() {
-        const {setProps, clear_on_unhover} = this.props;
+        const {
+            setProps,
+            clear_on_unhover,
+            relayoutData,
+            restyleData,
+            hoverData,
+            selectedData,
+        } = this.props;
 
         const gd = this.gd.current;
 
@@ -172,30 +177,30 @@ class PlotlyGraph extends Component {
             setProps({clickAnnotationData});
         });
         gd.on('plotly_hover', eventData => {
-            const hoverData = filterEventData(gd, eventData, 'hover');
-            if (!isNil(hoverData)) {
-                setProps({hoverData});
+            const hover = filterEventData(gd, eventData, 'hover');
+            if (!isNil(hover) && !equals(hover, hoverData)) {
+                setProps({hoverData: hover});
             }
         });
         gd.on('plotly_selected', eventData => {
-            const selectedData = filterEventData(gd, eventData, 'selected');
-            if (!isNil(selectedData)) {
-                setProps({selectedData});
+            const selected = filterEventData(gd, eventData, 'selected');
+            if (!isNil(selected) && !equals(selected, selectedData)) {
+                setProps({selectedData: selected});
             }
         });
         gd.on('plotly_deselect', () => {
             setProps({selectedData: null});
         });
         gd.on('plotly_relayout', eventData => {
-            const relayoutData = filterEventData(gd, eventData, 'relayout');
-            if (!isNil(relayoutData)) {
-                setProps({relayoutData});
+            const relayout = filterEventData(gd, eventData, 'relayout');
+            if (!isNil(relayout) && !equals(relayout, relayoutData)) {
+                setProps({relayoutData: relayout});
             }
         });
         gd.on('plotly_restyle', eventData => {
-            const restyleData = filterEventData(gd, eventData, 'restyle');
-            if (!isNil(restyleData)) {
-                setProps({restyleData});
+            const restyle = filterEventData(gd, eventData, 'restyle');
+            if (!isNil(restyle) && !equals(restyle, restyleData)) {
+                setProps({restyleData: restyle});
             }
         });
         gd.on('plotly_unhover', () => {
@@ -236,17 +241,11 @@ class PlotlyGraph extends Component {
              */
             return;
         }
-
-        const figureChanged = this.props.figure !== nextProps.figure;
-
-        if (figureChanged) {
+        if (this.props.figure !== nextProps.figure) {
             this.plot(nextProps);
         }
 
-        const extendDataChanged =
-            this.props.extendData !== nextProps.extendData;
-
-        if (extendDataChanged) {
+        if (this.props.extendData !== nextProps.extendData) {
             this.extend(nextProps);
         }
     }

package.json

@@ -1,6 +1,11 @@
+import pytest
+import pandas as pd
+import numpy as np
 import dash
 import dash_html_components as html
 import dash_core_components as dcc
+from dash.dependencies import Input, Output
+import dash.testing.wait as wait
 
 
 def test_grbs001_graph_without_ids(dash_duo):
@@ -20,3 +25,59 @@ def test_grbs001_graph_without_ids(dash_duo):
     assert not dash_duo.wait_for_element(".graph-no-id-2").get_attribute(
         "id"
     ), "the graph should contain no more auto-generated id"
+
+
+@pytest.mark.DCC608
+def test_grbs002_wrapped_graph_has_no_infinite_loop(dash_duo):
+
+    df = pd.DataFrame(np.random.randn(50, 50))
+    figure = {
+        "data": [
+            {"x": df.columns, "y": df.index, "z": df.values, "type": "heatmap"}
+        ],
+        "layout": {"xaxis": {"scaleanchor": "y"}},
+    }
+
+    app = dash.Dash(__name__)
+    app.layout = html.Div(
+        style={
+            "backgroundColor": "red",
+            "height": "100vmin",
+            "width": "100vmin",
+            "overflow": "hidden",
+            "position": "relative",
+        },
+        children=[
+            dcc.Loading(
+                children=[
+                    dcc.Graph(
+                        id="graph",
+                        figure=figure,
+                        style={
+                            "position": "absolute",
+                            "top": 0,
+                            "left": 0,
+                            "backgroundColor": "blue",
+                            "width": "100%",
+                            "height": "100%",
+                            "overflow": "hidden",
+                        },
+                    )
+                ]
+            )
+        ],
+    )
+
+    @app.callback(Output("graph", "figure"), [Input("graph", "relayoutData")])
+    def selected_df_figure(selection):
+        figure["data"][0]["x"] = df.columns
+        figure["data"][0]["y"] = df.index
+        figure["data"][0]["z"] = df.values
+        return figure
+
+    dash_duo.start_server(app)
+
+    wait.until(lambda: dash_duo.driver.title == "Dash", timeout=2)
+    assert (
+        len({dash_duo.driver.title for _ in range(20)}) == 1
+    ), "after the first update, there should contain no extra Updating..."