Adding drag_value to Slider

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.

[almarklein]

closes#107, replaces #884

This is an attempt to add a drag_value property to the Slider, such that different callbacks can be applied to the slider being dragged, and the slider being released, as proposed in #107.

Disclaimer: I am not yet familiar with the codebase of this repo, so I just tried to update the new property where the value property was updated.

Todo:

• The value is initially undefined, and I'm not sure how to initialize it to the same value as value.
• Also implement this for RangeSlider.
• update the docstring for updatemode to incorporate the new prop.
• RangeSlicer should be updated to use the same approach as Slicer.
• Tests.
• More docs.

---

Script to test this:

importdashimportdash_html_componentsashtmlimportdash_core_componentsasdccfromdash.dependenciesimportInput, Output, Stateapp=dash.Dash(__name__, update_title=None)
app.layout=html.Div(
[
#dcc.Slider(id='slider', min=100, max=200, value=150),dcc.RangeSlider(id='slider', min=100, max=200, value=(133, 166)),
html.Br(),
html.Div(id='drag_value', children="drag_value:"),
html.Div(id='value', children="value:"),
]
)
counts= {"drag_value": 0, "value": 0}
@app.callback(Output("drag_value", "children"), [Input("slider", "drag_value")],)defshow_slider_drag_value(v):
counts["drag_value"] +=1returnf"drag_value: {v} ({counts['drag_value']})"@app.callback(Output("value", "children"), [Input("slider", "value")],)defshow_slider_value(v):
counts["value"] +=1returnf"value: {v} ({counts['value']})"if__name__=="__main__":
app.run_server(debug=True)

[alexcjohnson]

@almarklein this PR is looking good! Seems like mainly it just needs a test or two added to test_sliders.py. That may be a bit tricky to get right, but seems like the test app would have a callback on both value and drag_value, then the test would require ActionChains like what we have for click_at_coord_fractions and presumably using click_and_hold then move_by_offset, then waiting for the right results to appear (and not appear) on the page, finally release and waiting for the other result to appear on the page.

[almarklein]

I refactored the code for the Slider a bit based on your suggestions. Using slider.value as an output now also updates slider.drag_value. This works fine locally (both in an example, and when running the test), but so far I have can't get CI working. Could you have a look at the current changes in fragments/Slider.react.js, and see if I am possibly missing something?

I have not updated the RangeSlider yet, not added a test for it, let's first get the slider working ...

[almarklein]

BTW, with assert dash_dcc.find_element("#out-drag-value").text == "You have dragged 5" I got to see the actual value: "You have dragged None".

[Marc-Andre-Rivet]

@alexcjohnson@almarklein I think the problem here is that the branch is out-of-date 1.13.0https://github.com/almarklein/dash-core-components/blob/drag_value2/package.json#L3 and the current version is 1.14.1. Updating the branch will probably fix the tests.

You can see in the Run Integration Tests step of test-37 that the installed version of DCC is 1.14.1

Name: dash-core-components
Version: 1.14.1
Summary: Core component suite for Dash
Home-page: UNKNOWN
Author: Chris Parmer <chris@plotly.com>
Author-email: chris@plotly.com
License: MIT
Location: /home/circleci/project/venv/lib/python3.7/site-packages
Requires: Required-by: dash

[alexcjohnson]

Ah, so perhaps installing dash caused it to go fetch the published dcc 1.14.1 rather than use the source in this branch, because it listed a lower version number? I'm still confused by this, because even in the build-dash step on your merge commit I see it downloading a published version of dcc

Collecting dash-core-components==1.14.1 (from dash==1.18.1)
Downloading https://files.pythonhosted.org/packages/0f/ab/5ffeeed41117383d02485f5b9204dcfaa074bfbb3ff2559afac7b904ad5c/dash_core_components-1.14.1.tar.gz (3.5MB)

So how do I know we're not using that version (other than that the test passes? Is there some way we could definitively check at the beginning of the test that the version of this repo that we're running is precisely the intended commit? Or set this up in a more robust way so this issue can't recur?

[Marc-Andre-Rivet]

@alexcjohnson Not sure about that. It's that way because we use the tarball from the previous build step -- in other repos we simply do pip install -e . and so the error would be more obvious.

[almarklein]

Wow, thanks @Marc-Andre-Rivet !

[Marc-Andre-Rivet]

@alexcjohnson I think we could simply pip uninstall dash-core-components -y before installing the local build and see it 💥 if misaligned.

[almarklein]

🎆 Ready from my end.

[almarklein]

About documentation, I think we'd need to add an example to the docs at the dash-docs repo, right?

[alexcjohnson]

Fantastic! 💃

Yes, the final step will be to add an example in dash-docs.