Skip to content

Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
alexcjohnson merged 17 commits into from
Jul 9, 2020
Merged

Configure document-title during updates #1315

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
6525ca2
Add update_title parameter
stlehmann Jun 13, 2020
3061cba
Save update_title to config
stlehmann Jun 28, 2020
eb427b0
Pass update_title to frontend
stlehmann Jun 28, 2020
28630d9
Use update_title in DocumentTitle component
stlehmann Jun 28, 2020
2f7cdc4
Do not change title if update_title is null
stlehmann Jun 28, 2020
899b20e
Merge branch 'dev' into update-title
stlehmann Jun 28, 2020
f5f97cc
Add changelog entry
stlehmann Jun 28, 2020
1db09c9
Put changelog entry in Unreleased section
stlehmann Jun 29, 2020
8046178
Simplify update_title state assignment
stlehmann Jun 29, 2020
745ba77
Fix config PropType
stlehmann Jun 29, 2020
57f9b37
Update CHANGELOG.md
stlehmann Jun 29, 2020
740b913
Make config PropType more explicit
stlehmann Jun 29, 2020
71ee5ec
Add tests for update_title in test_loading_states.py
stlehmann Jun 30, 2020
bb2a6f7
Fix test function names
stlehmann Jun 30, 2020
571d6ce
Elaborate test sequence
stlehmann Jul 1, 2020
58b1472
Move test out of callback
stlehmann Jul 2, 2020
087774d
Merge branch 'dev' into update-title
alexcjohnson Jul 8, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.

## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down
8 changes: 6 additions & 2 deletions dash-renderer/src/components/core/DocumentTitle.react.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
constructor(props) {
super(props);
const {update_title} = props.config;
this.state = {
initialTitle: document.title,
update_title,
};
}

UNSAFE_componentWillReceiveProps(props) {
if (props.isLoading) {
document.title = 'Updating...';

@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.

if (this.state.update_title && props.isLoading) {
document.title = this.state.update_title;
} else {
document.title = this.state.initialTitle;
}
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
isLoading: PropTypes.bool.isRequired,
config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
isLoading: state.isLoading,
config: state.config,
}))(DocumentTitle);
3 changes: 3 additions & 0 deletions dash/dash.py
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
prevent_initial_callbacks=False,
show_undo_redo=False,
plugins=None,
update_title="Updating...",
**obsolete
):
_validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
),
prevent_initial_callbacks=prevent_initial_callbacks,
show_undo_redo=show_undo_redo,
update_title=update_title,
)
self.config.set_read_only(
[
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
"props_check": self._dev_tools.props_check,
"show_undo_redo": self.config.show_undo_redo,
"suppress_callback_exceptions": self.config.suppress_callback_exceptions,
"update_title": self.config.update_title,
}
if self._dev_tools.hot_reload:
config["hot_reload"] = {
Expand Down
45 changes: 45 additions & 0 deletions tests/integration/renderer/test_loading_states.py
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

find_spinners()
find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
"kwargs, expected_update_title",
[
({}, "Updating..."),
({"update_title": None}, "Dash"),
({"update_title": ""}, "Dash"),
({"update_title": "Hello World"}, "Hello World"),
]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
app = dash.Dash("Dash", **kwargs)
lock = Lock()

app.layout = html.Div(
children=[
html.H3("Press button see document title updating"),
html.Div(id="output"),
html.Button("Update", id="button", n_clicks=0),
]
)

@app.callback(
Output("output", "children"),
[Input("button", "n_clicks")]
)
def update(n):
with lock:
return n

with lock:
dash_duo.start_server(app)
# check for update-title during startup
until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

# check for original title after loading
until(lambda: dash_duo.driver.title == "Dash", timeout=1)

with lock:
dash_duo.find_element("#button").click()
# check for update-title while processing callback
until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all 
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Configure document-title during updates by stlehmann · Pull Request #1315 · plotly/dash · GitHub
Skip to content
Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

 Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

 Merged

alexcjohnson
merged 17 commits into

from

Jul 9, 2020
 Merged


Configure document-title during updates
#1315
Show file tree
Hide file tree
 Changes from all commits
Commits

Show all changes


17 commits


Select commit
Hold shift + click to select a range
6525ca2

Add update_title parameter


stlehmann Jun 13, 2020
3061cba

Save update_title to config


stlehmann Jun 28, 2020
eb427b0

Pass update_title to frontend


stlehmann Jun 28, 2020
28630d9

Use update_title in DocumentTitle component


stlehmann Jun 28, 2020
2f7cdc4

Do not change title if update_title is null


stlehmann Jun 28, 2020
899b20e

Merge branch 'dev' into update-title


stlehmann Jun 28, 2020
f5f97cc

Add changelog entry


stlehmann Jun 28, 2020
1db09c9

Put changelog entry in Unreleased section


stlehmann Jun 29, 2020
8046178

Simplify update_title state assignment


stlehmann Jun 29, 2020
745ba77

Fix config PropType


stlehmann Jun 29, 2020
57f9b37

Update CHANGELOG.md


stlehmann Jun 29, 2020
740b913

Make config PropType more explicit


stlehmann Jun 29, 2020
71ee5ec

Add tests for update_title in test_loading_states.py


stlehmann Jun 30, 2020
bb2a6f7

Fix test function names


stlehmann Jun 30, 2020
571d6ce

Elaborate test sequence


stlehmann Jul 1, 2020
58b1472

Move test out of callback


stlehmann Jul 2, 2020
087774d

Merge branch 'dev' into update-title


alexcjohnson Jul 8, 2020

File filter

Filter by extension
Filter by extension
Conversations

Failed to load comments. 
Loading
Jump to

Jump to file


Failed to load files. 
Loading
 Diff view

 Diff view


4 changes: 4 additions & 0 deletions
CHANGELOG.md

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.


## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down

8 changes: 6 additions & 2 deletions
dash-renderer/src/components/core/DocumentTitle.react.js

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
 constructor(props) {
 super(props);
 const {update_title} = props.config;
 this.state = {
 initialTitle: document.title,
 update_title,
 };
 }

 UNSAFE_componentWillReceiveProps(props) {
 if (props.isLoading) {
 document.title = 'Updating...';
@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link


Copy Markdown

Collaborator
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.
 if (this.state.update_title && props.isLoading) {
 document.title = this.state.update_title;
 } else {
 document.title = this.state.initialTitle;
 }
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
 isLoading: PropTypes.bool.isRequired,
 config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
 isLoading: state.isLoading,
 config: state.config,
}))(DocumentTitle);

3 changes: 3 additions & 0 deletions
dash/dash.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
 prevent_initial_callbacks=False,
 show_undo_redo=False,
 plugins=None,
 update_title="Updating...",
 **obsolete
 ):
 _validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
 ),
 prevent_initial_callbacks=prevent_initial_callbacks,
 show_undo_redo=show_undo_redo,
 update_title=update_title,
 )
 self.config.set_read_only(
 [
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
 "props_check": self._dev_tools.props_check,
 "show_undo_redo": self.config.show_undo_redo,
 "suppress_callback_exceptions": self.config.suppress_callback_exceptions,
 "update_title": self.config.update_title,
 }
 if self._dev_tools.hot_reload:
 config["hot_reload"] = {
Expand Down

45 changes: 45 additions & 0 deletions
tests/integration/renderer/test_loading_states.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

 find_spinners()
 find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
 "kwargs, expected_update_title",
 [
 ({}, "Updating..."),
 ({"update_title": None}, "Dash"),
 ({"update_title": ""}, "Dash"),
 ({"update_title": "Hello World"}, "Hello World"),
 ]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
 app = dash.Dash("Dash", **kwargs)
 lock = Lock()

 app.layout = html.Div(
 children=[
 html.H3("Press button see document title updating"),
 html.Div(id="output"),
 html.Button("Update", id="button", n_clicks=0),
 ]
 )

 @app.callback(
 Output("output", "children"),
 [Input("button", "n_clicks")]
 )
 def update(n):
 with lock:
 return n

 with lock:
 dash_duo.start_server(app)
 # check for update-title during startup
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

 # check for original title after loading
 until(lambda: dash_duo.driver.title == "Dash", timeout=1)

 with lock:
 dash_duo.find_element("#button").click()
 # check for update-title while processing callback
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Force GitHub README to respect dark mode
(function() {
var style = document.createElement('style');
style.textContent = '
.markdown-body {
color-scheme: dark light;
}
.markdown-body pre { background: #161b22 !important; }
.markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }
.markdown-body table th, .markdown-body table td { border-color: #30363d !important; }
.markdown-body img { background: #0d1117; }
.markdown-body blockquote { border-left-color: #8b949e; }
.markdown-body hr { border-color: #30363d; }
';
document.head.appendChild(style);
})();
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
Configure document-title during updates by stlehmann · Pull Request #1315 · plotly/dash · GitHub
Skip to content
Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

 Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

 Merged

alexcjohnson
merged 17 commits into

from

Jul 9, 2020
 Merged


Configure document-title during updates
#1315
Show file tree
Hide file tree
 Changes from all commits
Commits

Show all changes


17 commits


Select commit
Hold shift + click to select a range
6525ca2

Add update_title parameter


stlehmann Jun 13, 2020
3061cba

Save update_title to config


stlehmann Jun 28, 2020
eb427b0

Pass update_title to frontend


stlehmann Jun 28, 2020
28630d9

Use update_title in DocumentTitle component


stlehmann Jun 28, 2020
2f7cdc4

Do not change title if update_title is null


stlehmann Jun 28, 2020
899b20e

Merge branch 'dev' into update-title


stlehmann Jun 28, 2020
f5f97cc

Add changelog entry


stlehmann Jun 28, 2020
1db09c9

Put changelog entry in Unreleased section


stlehmann Jun 29, 2020
8046178

Simplify update_title state assignment


stlehmann Jun 29, 2020
745ba77

Fix config PropType


stlehmann Jun 29, 2020
57f9b37

Update CHANGELOG.md


stlehmann Jun 29, 2020
740b913

Make config PropType more explicit


stlehmann Jun 29, 2020
71ee5ec

Add tests for update_title in test_loading_states.py


stlehmann Jun 30, 2020
bb2a6f7

Fix test function names


stlehmann Jun 30, 2020
571d6ce

Elaborate test sequence


stlehmann Jul 1, 2020
58b1472

Move test out of callback


stlehmann Jul 2, 2020
087774d

Merge branch 'dev' into update-title


alexcjohnson Jul 8, 2020

File filter

Filter by extension
Filter by extension
Conversations

Failed to load comments. 
Loading
Jump to

Jump to file


Failed to load files. 
Loading
 Diff view

 Diff view


4 changes: 4 additions & 0 deletions
CHANGELOG.md

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.


## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down

8 changes: 6 additions & 2 deletions
dash-renderer/src/components/core/DocumentTitle.react.js

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
 constructor(props) {
 super(props);
 const {update_title} = props.config;
 this.state = {
 initialTitle: document.title,
 update_title,
 };
 }

 UNSAFE_componentWillReceiveProps(props) {
 if (props.isLoading) {
 document.title = 'Updating...';
@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link


Copy Markdown

Collaborator
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.
 if (this.state.update_title && props.isLoading) {
 document.title = this.state.update_title;
 } else {
 document.title = this.state.initialTitle;
 }
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
 isLoading: PropTypes.bool.isRequired,
 config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
 isLoading: state.isLoading,
 config: state.config,
}))(DocumentTitle);

3 changes: 3 additions & 0 deletions
dash/dash.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
 prevent_initial_callbacks=False,
 show_undo_redo=False,
 plugins=None,
 update_title="Updating...",
 **obsolete
 ):
 _validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
 ),
 prevent_initial_callbacks=prevent_initial_callbacks,
 show_undo_redo=show_undo_redo,
 update_title=update_title,
 )
 self.config.set_read_only(
 [
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
 "props_check": self._dev_tools.props_check,
 "show_undo_redo": self.config.show_undo_redo,
 "suppress_callback_exceptions": self.config.suppress_callback_exceptions,
 "update_title": self.config.update_title,
 }
 if self._dev_tools.hot_reload:
 config["hot_reload"] = {
Expand Down

45 changes: 45 additions & 0 deletions
tests/integration/renderer/test_loading_states.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

 find_spinners()
 find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
 "kwargs, expected_update_title",
 [
 ({}, "Updating..."),
 ({"update_title": None}, "Dash"),
 ({"update_title": ""}, "Dash"),
 ({"update_title": "Hello World"}, "Hello World"),
 ]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
 app = dash.Dash("Dash", **kwargs)
 lock = Lock()

 app.layout = html.Div(
 children=[
 html.H3("Press button see document title updating"),
 html.Div(id="output"),
 html.Button("Update", id="button", n_clicks=0),
 ]
 )

 @app.callback(
 Output("output", "children"),
 [Input("button", "n_clicks")]
 )
 def update(n):
 with lock:
 return n

 with lock:
 dash_duo.start_server(app)
 # check for update-title during startup
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

 # check for original title after loading
 until(lambda: dash_duo.driver.title == "Dash", timeout=1)

 with lock:
 dash_duo.find_element("#button").click()
 # check for update-title while processing callback
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Highlight search terms from Google/DuckDuckGo/Bing referrer
(function() {
var ref = document.referrer;
var terms = [];
if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {
var url = new URL(ref);
var q = url.searchParams.get('q') || url.searchParams.get('p');
if (q) {
terms = q.split(/\s+/).filter(function(t) { return t.length > 2; });
}
}
if (terms.length === 0) return;
var style = document.createElement('style');
style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';
document.head.appendChild(style);
function highlight(node) {
if (node.nodeType === 3) { // text node
var text = node.textContent;
var found = false;
terms.forEach(function(term) {
var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi');
if (regex.test(text)) {
found = true;
var frag = document.createDocumentFragment();
var parts = text.split(regex);
parts.forEach(function(part, i) {
if (i % 2 === 0) {
frag.appendChild(document.createTextNode(part));
} else {
var span = document.createElement('span');
span.className = 'userscript-highlight';
span.textContent = part;
frag.appendChild(span);
}
});
node.parentNode.replaceChild(frag, node);
}
});
} else if (node.nodeType === 1 && node.childNodes) { // element
var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];
if (!skipTags.includes(node.tagName)) {
Array.from(node.childNodes).forEach(highlight);
}
}
}
highlight(document.body);
// Re-highlight on dynamic content
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1 || node.nodeType === 3) highlight(node);
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
Configure document-title during updates by stlehmann · Pull Request #1315 · plotly/dash · GitHub
Skip to content
Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

 Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

 Merged

alexcjohnson
merged 17 commits into

from

Jul 9, 2020
 Merged


Configure document-title during updates
#1315
Show file tree
Hide file tree
 Changes from all commits
Commits

Show all changes


17 commits


Select commit
Hold shift + click to select a range
6525ca2

Add update_title parameter


stlehmann Jun 13, 2020
3061cba

Save update_title to config


stlehmann Jun 28, 2020
eb427b0

Pass update_title to frontend


stlehmann Jun 28, 2020
28630d9

Use update_title in DocumentTitle component


stlehmann Jun 28, 2020
2f7cdc4

Do not change title if update_title is null


stlehmann Jun 28, 2020
899b20e

Merge branch 'dev' into update-title


stlehmann Jun 28, 2020
f5f97cc

Add changelog entry


stlehmann Jun 28, 2020
1db09c9

Put changelog entry in Unreleased section


stlehmann Jun 29, 2020
8046178

Simplify update_title state assignment


stlehmann Jun 29, 2020
745ba77

Fix config PropType


stlehmann Jun 29, 2020
57f9b37

Update CHANGELOG.md


stlehmann Jun 29, 2020
740b913

Make config PropType more explicit


stlehmann Jun 29, 2020
71ee5ec

Add tests for update_title in test_loading_states.py


stlehmann Jun 30, 2020
bb2a6f7

Fix test function names


stlehmann Jun 30, 2020
571d6ce

Elaborate test sequence


stlehmann Jul 1, 2020
58b1472

Move test out of callback


stlehmann Jul 2, 2020
087774d

Merge branch 'dev' into update-title


alexcjohnson Jul 8, 2020

File filter

Filter by extension
Filter by extension
Conversations

Failed to load comments. 
Loading
Jump to

Jump to file


Failed to load files. 
Loading
 Diff view

 Diff view


4 changes: 4 additions & 0 deletions
CHANGELOG.md

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.


## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down

8 changes: 6 additions & 2 deletions
dash-renderer/src/components/core/DocumentTitle.react.js

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
 constructor(props) {
 super(props);
 const {update_title} = props.config;
 this.state = {
 initialTitle: document.title,
 update_title,
 };
 }

 UNSAFE_componentWillReceiveProps(props) {
 if (props.isLoading) {
 document.title = 'Updating...';
@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link


Copy Markdown

Collaborator
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.
 if (this.state.update_title && props.isLoading) {
 document.title = this.state.update_title;
 } else {
 document.title = this.state.initialTitle;
 }
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
 isLoading: PropTypes.bool.isRequired,
 config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
 isLoading: state.isLoading,
 config: state.config,
}))(DocumentTitle);

3 changes: 3 additions & 0 deletions
dash/dash.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
 prevent_initial_callbacks=False,
 show_undo_redo=False,
 plugins=None,
 update_title="Updating...",
 **obsolete
 ):
 _validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
 ),
 prevent_initial_callbacks=prevent_initial_callbacks,
 show_undo_redo=show_undo_redo,
 update_title=update_title,
 )
 self.config.set_read_only(
 [
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
 "props_check": self._dev_tools.props_check,
 "show_undo_redo": self.config.show_undo_redo,
 "suppress_callback_exceptions": self.config.suppress_callback_exceptions,
 "update_title": self.config.update_title,
 }
 if self._dev_tools.hot_reload:
 config["hot_reload"] = {
Expand Down

45 changes: 45 additions & 0 deletions
tests/integration/renderer/test_loading_states.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

 find_spinners()
 find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
 "kwargs, expected_update_title",
 [
 ({}, "Updating..."),
 ({"update_title": None}, "Dash"),
 ({"update_title": ""}, "Dash"),
 ({"update_title": "Hello World"}, "Hello World"),
 ]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
 app = dash.Dash("Dash", **kwargs)
 lock = Lock()

 app.layout = html.Div(
 children=[
 html.H3("Press button see document title updating"),
 html.Div(id="output"),
 html.Button("Update", id="button", n_clicks=0),
 ]
 )

 @app.callback(
 Output("output", "children"),
 [Input("button", "n_clicks")]
 )
 def update(n):
 with lock:
 return n

 with lock:
 dash_duo.start_server(app)
 # check for update-title during startup
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

 # check for original title after loading
 until(lambda: dash_duo.driver.title == "Dash", timeout=1)

 with lock:
 dash_duo.find_element("#button").click()
 # check for update-title while processing callback
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Strip utm_, fbclid, gclid, etc. from all links on page
(function() {
var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',
'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',
'ref', 'ref_src', 'source', 'medium', 'campaign'];
function cleanUrl(url) {
try {
var u = new URL(url, window.location.origin);
var changed = false;
trackingParams.forEach(function(p) {
if (u.searchParams.has(p)) {
u.searchParams.delete(p);
changed = true;
}
});
return changed ? u.toString() : url;
} catch (e) {
return url;
}
}
function cleanLinks() {
document.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
cleanLinks();
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1) {
if (node.tagName === 'A') cleanLinks();
node.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '
Configure document-title during updates by stlehmann · Pull Request #1315 · plotly/dash · GitHub
Skip to content
Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

 Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

 Merged

alexcjohnson
merged 17 commits into

from

Jul 9, 2020
 Merged


Configure document-title during updates
#1315
Show file tree
Hide file tree
 Changes from all commits
Commits

Show all changes


17 commits


Select commit
Hold shift + click to select a range
6525ca2

Add update_title parameter


stlehmann Jun 13, 2020
3061cba

Save update_title to config


stlehmann Jun 28, 2020
eb427b0

Pass update_title to frontend


stlehmann Jun 28, 2020
28630d9

Use update_title in DocumentTitle component


stlehmann Jun 28, 2020
2f7cdc4

Do not change title if update_title is null


stlehmann Jun 28, 2020
899b20e

Merge branch 'dev' into update-title


stlehmann Jun 28, 2020
f5f97cc

Add changelog entry


stlehmann Jun 28, 2020
1db09c9

Put changelog entry in Unreleased section


stlehmann Jun 29, 2020
8046178

Simplify update_title state assignment


stlehmann Jun 29, 2020
745ba77

Fix config PropType


stlehmann Jun 29, 2020
57f9b37

Update CHANGELOG.md


stlehmann Jun 29, 2020
740b913

Make config PropType more explicit


stlehmann Jun 29, 2020
71ee5ec

Add tests for update_title in test_loading_states.py


stlehmann Jun 30, 2020
bb2a6f7

Fix test function names


stlehmann Jun 30, 2020
571d6ce

Elaborate test sequence


stlehmann Jul 1, 2020
58b1472

Move test out of callback


stlehmann Jul 2, 2020
087774d

Merge branch 'dev' into update-title


alexcjohnson Jul 8, 2020

File filter

Filter by extension
Filter by extension
Conversations

Failed to load comments. 
Loading
Jump to

Jump to file


Failed to load files. 
Loading
 Diff view

 Diff view


4 changes: 4 additions & 0 deletions
CHANGELOG.md

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.


## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down

8 changes: 6 additions & 2 deletions
dash-renderer/src/components/core/DocumentTitle.react.js

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
 constructor(props) {
 super(props);
 const {update_title} = props.config;
 this.state = {
 initialTitle: document.title,
 update_title,
 };
 }

 UNSAFE_componentWillReceiveProps(props) {
 if (props.isLoading) {
 document.title = 'Updating...';
@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link


Copy Markdown

Collaborator
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.
 if (this.state.update_title && props.isLoading) {
 document.title = this.state.update_title;
 } else {
 document.title = this.state.initialTitle;
 }
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
 isLoading: PropTypes.bool.isRequired,
 config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
 isLoading: state.isLoading,
 config: state.config,
}))(DocumentTitle);

3 changes: 3 additions & 0 deletions
dash/dash.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
 prevent_initial_callbacks=False,
 show_undo_redo=False,
 plugins=None,
 update_title="Updating...",
 **obsolete
 ):
 _validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
 ),
 prevent_initial_callbacks=prevent_initial_callbacks,
 show_undo_redo=show_undo_redo,
 update_title=update_title,
 )
 self.config.set_read_only(
 [
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
 "props_check": self._dev_tools.props_check,
 "show_undo_redo": self.config.show_undo_redo,
 "suppress_callback_exceptions": self.config.suppress_callback_exceptions,
 "update_title": self.config.update_title,
 }
 if self._dev_tools.hot_reload:
 config["hot_reload"] = {
Expand Down

45 changes: 45 additions & 0 deletions
tests/integration/renderer/test_loading_states.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

 find_spinners()
 find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
 "kwargs, expected_update_title",
 [
 ({}, "Updating..."),
 ({"update_title": None}, "Dash"),
 ({"update_title": ""}, "Dash"),
 ({"update_title": "Hello World"}, "Hello World"),
 ]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
 app = dash.Dash("Dash", **kwargs)
 lock = Lock()

 app.layout = html.Div(
 children=[
 html.H3("Press button see document title updating"),
 html.Div(id="output"),
 html.Button("Update", id="button", n_clicks=0),
 ]
 )

 @app.callback(
 Output("output", "children"),
 [Input("button", "n_clicks")]
 )
 def update(n):
 with lock:
 return n

 with lock:
 dash_duo.start_server(app)
 # check for update-title during startup
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

 # check for original title after loading
 until(lambda: dash_duo.driver.title == "Dash", timeout=1)

 with lock:
 dash_duo.find_element("#button").click()
 # check for update-title while processing callback
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Auto-enable theater mode on YouTube
(function() {
function tryTheater() {
var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]');
if (btn && !btn.classList.contains('activated')) {
btn.click();
}
}
// Try immediately
tryTheater();
// Try after navigation (SPA)
var lastUrl = location.href;
setInterval(function() {
if (location.href !== lastUrl) {
lastUrl = location.href;
setTimeout(tryTheater, 500);
}
}, 1000);
// Also try on player load
var observer = new MutationObserver(tryTheater);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
Configure document-title during updates by stlehmann · Pull Request #1315 · plotly/dash · GitHub
Skip to content
Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

 Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

 Merged

alexcjohnson
merged 17 commits into

from

Jul 9, 2020
 Merged


Configure document-title during updates
#1315
Show file tree
Hide file tree
 Changes from all commits
Commits

Show all changes


17 commits


Select commit
Hold shift + click to select a range
6525ca2

Add update_title parameter


stlehmann Jun 13, 2020
3061cba

Save update_title to config


stlehmann Jun 28, 2020
eb427b0

Pass update_title to frontend


stlehmann Jun 28, 2020
28630d9

Use update_title in DocumentTitle component


stlehmann Jun 28, 2020
2f7cdc4

Do not change title if update_title is null


stlehmann Jun 28, 2020
899b20e

Merge branch 'dev' into update-title


stlehmann Jun 28, 2020
f5f97cc

Add changelog entry


stlehmann Jun 28, 2020
1db09c9

Put changelog entry in Unreleased section


stlehmann Jun 29, 2020
8046178

Simplify update_title state assignment


stlehmann Jun 29, 2020
745ba77

Fix config PropType


stlehmann Jun 29, 2020
57f9b37

Update CHANGELOG.md


stlehmann Jun 29, 2020
740b913

Make config PropType more explicit


stlehmann Jun 29, 2020
71ee5ec

Add tests for update_title in test_loading_states.py


stlehmann Jun 30, 2020
bb2a6f7

Fix test function names


stlehmann Jun 30, 2020
571d6ce

Elaborate test sequence


stlehmann Jul 1, 2020
58b1472

Move test out of callback


stlehmann Jul 2, 2020
087774d

Merge branch 'dev' into update-title


alexcjohnson Jul 8, 2020

File filter

Filter by extension
Filter by extension
Conversations

Failed to load comments. 
Loading
Jump to

Jump to file


Failed to load files. 
Loading
 Diff view

 Diff view


4 changes: 4 additions & 0 deletions
CHANGELOG.md

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.


## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down

8 changes: 6 additions & 2 deletions
dash-renderer/src/components/core/DocumentTitle.react.js

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
 constructor(props) {
 super(props);
 const {update_title} = props.config;
 this.state = {
 initialTitle: document.title,
 update_title,
 };
 }

 UNSAFE_componentWillReceiveProps(props) {
 if (props.isLoading) {
 document.title = 'Updating...';
@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link


Copy Markdown

Collaborator
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.
 if (this.state.update_title && props.isLoading) {
 document.title = this.state.update_title;
 } else {
 document.title = this.state.initialTitle;
 }
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
 isLoading: PropTypes.bool.isRequired,
 config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
 isLoading: state.isLoading,
 config: state.config,
}))(DocumentTitle);

3 changes: 3 additions & 0 deletions
dash/dash.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
 prevent_initial_callbacks=False,
 show_undo_redo=False,
 plugins=None,
 update_title="Updating...",
 **obsolete
 ):
 _validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
 ),
 prevent_initial_callbacks=prevent_initial_callbacks,
 show_undo_redo=show_undo_redo,
 update_title=update_title,
 )
 self.config.set_read_only(
 [
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
 "props_check": self._dev_tools.props_check,
 "show_undo_redo": self.config.show_undo_redo,
 "suppress_callback_exceptions": self.config.suppress_callback_exceptions,
 "update_title": self.config.update_title,
 }
 if self._dev_tools.hot_reload:
 config["hot_reload"] = {
Expand Down

45 changes: 45 additions & 0 deletions
tests/integration/renderer/test_loading_states.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

 find_spinners()
 find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
 "kwargs, expected_update_title",
 [
 ({}, "Updating..."),
 ({"update_title": None}, "Dash"),
 ({"update_title": ""}, "Dash"),
 ({"update_title": "Hello World"}, "Hello World"),
 ]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
 app = dash.Dash("Dash", **kwargs)
 lock = Lock()

 app.layout = html.Div(
 children=[
 html.H3("Press button see document title updating"),
 html.Div(id="output"),
 html.Button("Update", id="button", n_clicks=0),
 ]
 )

 @app.callback(
 Output("output", "children"),
 [Input("button", "n_clicks")]
 )
 def update(n):
 with lock:
 return n

 with lock:
 dash_duo.start_server(app)
 # check for update-title during startup
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

 # check for original title after loading
 until(lambda: dash_duo.driver.title == "Dash", timeout=1)

 with lock:
 dash_duo.find_element("#button").click()
 # check for update-title while processing callback
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Remove or un-stick sticky/fixed headers that block content
(function() {
function unstick() {
document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) {
if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {
el.style.position = 'static';
el.style.top = 'auto';
el.style.zIndex = 'auto';
}
});
}
unstick();
var observer = new MutationObserver(unstick);
observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });
})();
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
})();
Configure document-title during updates by stlehmann · Pull Request #1315 · plotly/dash · GitHub
Skip to content
Configure document-title during updates#1315

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

 Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account

 Merged

alexcjohnson
merged 17 commits into

from

Jul 9, 2020
 Merged


Configure document-title during updates
#1315
Show file tree
Hide file tree
 Changes from all commits
Commits

Show all changes


17 commits


Select commit
Hold shift + click to select a range
6525ca2

Add update_title parameter


stlehmann Jun 13, 2020
3061cba

Save update_title to config


stlehmann Jun 28, 2020
eb427b0

Pass update_title to frontend


stlehmann Jun 28, 2020
28630d9

Use update_title in DocumentTitle component


stlehmann Jun 28, 2020
2f7cdc4

Do not change title if update_title is null


stlehmann Jun 28, 2020
899b20e

Merge branch 'dev' into update-title


stlehmann Jun 28, 2020
f5f97cc

Add changelog entry


stlehmann Jun 28, 2020
1db09c9

Put changelog entry in Unreleased section


stlehmann Jun 29, 2020
8046178

Simplify update_title state assignment


stlehmann Jun 29, 2020
745ba77

Fix config PropType


stlehmann Jun 29, 2020
57f9b37

Update CHANGELOG.md


stlehmann Jun 29, 2020
740b913

Make config PropType more explicit


stlehmann Jun 29, 2020
71ee5ec

Add tests for update_title in test_loading_states.py


stlehmann Jun 30, 2020
bb2a6f7

Fix test function names


stlehmann Jun 30, 2020
571d6ce

Elaborate test sequence


stlehmann Jul 1, 2020
58b1472

Move test out of callback


stlehmann Jul 2, 2020
087774d

Merge branch 'dev' into update-title


alexcjohnson Jul 8, 2020

File filter

Filter by extension
Filter by extension
Conversations

Failed to load comments. 
Loading
Jump to

Jump to file


Failed to load files. 
Loading
 Diff view

 Diff view


4 changes: 4 additions & 0 deletions
CHANGELOG.md

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -2,6 +2,10 @@
All notable changes to `dash` will be documented in this file.
This project adheres to [Semantic Versioning](https://semver.org/).

## Unreleased
### Added
- [#1315](https://github.com/plotly/dash/pull/1315) Add `update_title` parameter to set or disable the "Updating...." document title during updates. Closes [#856](https://github.com/plotly/dash/issues/856) and [#732](https://github.com/plotly/dash/issues/732)
Comment thread
stlehmann marked this conversation as resolved.


## [1.13.4] - 2020-06-25
### Fixed
- [#1310](https://github.com/plotly/dash/pull/1310) Fix a regression since 1.13.0 preventing more than one loading state from being shown at a time.
Expand Down

8 changes: 6 additions & 2 deletions
dash-renderer/src/components/core/DocumentTitle.react.js

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -5,14 +5,16 @@ import PropTypes from 'prop-types';
class DocumentTitle extends Component {
 constructor(props) {
 super(props);
 const {update_title} = props.config;
 this.state = {
 initialTitle: document.title,
 update_title,
 };
 }

 UNSAFE_componentWillReceiveProps(props) {
 if (props.isLoading) {
 document.title = 'Updating...';
@alexcjohnsonalexcjohnsonJul 15, 2020

Copy link


Copy Markdown

Collaborator
Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Marc-Andre-Rivet as we were discussing the other day - the renderer no longer holds this default value at all. That means when the R and Julia implementations update to include this functionality in their renderer, they will need to add this option to the back end at the same time or the default behavior will change to no title changes ever.
 if (this.state.update_title && props.isLoading) {
 document.title = this.state.update_title;
 } else {
 document.title = this.state.initialTitle;
 }
Expand All@@ -29,8 +31,10 @@ class DocumentTitle extends Component {

DocumentTitle.propTypes = {
 isLoading: PropTypes.bool.isRequired,
 config: PropTypes.shape({update_title: PropTypes.string}),
};

export default connect(state => ({
 isLoading: state.isLoading,
 config: state.config,
}))(DocumentTitle);

3 changes: 3 additions & 0 deletions
dash/dash.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
Expand Up@@ -252,6 +252,7 @@ def __init__(
 prevent_initial_callbacks=False,
 show_undo_redo=False,
 plugins=None,
 update_title="Updating...",
 **obsolete
 ):
 _validate.check_obsolete(obsolete)
Expand DownExpand Up@@ -299,6 +300,7 @@ def __init__(
 ),
 prevent_initial_callbacks=prevent_initial_callbacks,
 show_undo_redo=show_undo_redo,
 update_title=update_title,
 )
 self.config.set_read_only(
 [
Expand DownExpand Up@@ -506,6 +508,7 @@ def _config(self):
 "props_check": self._dev_tools.props_check,
 "show_undo_redo": self.config.show_undo_redo,
 "suppress_callback_exceptions": self.config.suppress_callback_exceptions,
 "update_title": self.config.update_title,
 }
 if self._dev_tools.hot_reload:
 config["hot_reload"] = {
Expand Down

45 changes: 45 additions & 0 deletions
tests/integration/renderer/test_loading_states.py

View file


Open in desktop

Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
from multiprocessing import Lock

import pytest
import dash
from dash.dependencies import Input, Output
from dash.testing.wait import until

import dash_core_components as dcc
import dash_html_components as html
Expand DownExpand Up@@ -167,3 +169,46 @@ def find_text(spec):

 find_spinners()
 find_text({1: 1, 2: 1, 3: 1, 4: 1})


@pytest.mark.parametrize(
 "kwargs, expected_update_title",
 [
 ({}, "Updating..."),
 ({"update_title": None}, "Dash"),
 ({"update_title": ""}, "Dash"),
 ({"update_title": "Hello World"}, "Hello World"),
 ]
)
def test_rdls003_update_title(dash_duo, kwargs, expected_update_title):
 app = dash.Dash("Dash", **kwargs)
 lock = Lock()

 app.layout = html.Div(
 children=[
 html.H3("Press button see document title updating"),
 html.Div(id="output"),
 html.Button("Update", id="button", n_clicks=0),
 ]
 )

 @app.callback(
 Output("output", "children"),
 [Input("button", "n_clicks")]
 )
 def update(n):
 with lock:
 return n

 with lock:
 dash_duo.start_server(app)
 # check for update-title during startup
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)

 # check for original title after loading
 until(lambda: dash_duo.driver.title == "Dash", timeout=1)

 with lock:
 dash_duo.find_element("#button").click()
 # check for update-title while processing callback
 until(lambda: dash_duo.driver.title == expected_update_title, timeout=1)