使用 dash.testing 进行 Dash 测试 dcc.upload

Question

在编写生产就绪代码时，我们希望能够在每次更新代码时自动测试我们的 Web 应用程序。 python 的破折号允许通过 dash.testing。但是在我的应用程序中，我使用 dcc.Upload() 组件上传了一个 excel 文件。

如何编写可以将上传 link 发送到此组件的测试？

Answer 1

dcc.Upload 组件不允许您在存储上传 link。

上放置 id

通过检查您使用网络开发人员工具创建的上传 button/field 可以轻松解决此问题。在元素选项卡中查找包含 "<input type=file ... >". 的行。右键单击它并按复制 xpath 它应该给你一个像 //*[@id="upload-data"]/div/input

这样的相对路径

测试用例看起来像这样

from dash.testing.application_runners import import_app
def test_xxxx001_upload(dash_duo):
    
    # get app from app.py
    app = import_app("src.app")
    dash_duo.start_server(app)

    # find element that contains input link. Utilize the web driver to get the element
    element = dash_duo.driver.find_element_by_xpath('//*[@id="upload-data"]/div/input')
    element.send_keys("C:\path\to\testData.xlsx")

文件夹结构

myapp
   --src
      --app.py
      --server.py
      --run.py
   --tests
      --test_app

使用dcc.Upload组件创建上传按钮

import dash_core_components as dcc
import dash_html_components as html

html.Div(
    id="file-drop",
    children=[
        dcc.Upload(
            id="upload-data",
            children=html.Div(
                ["Drag and Drop or ", html.A("Select File"),],
                id="select-file",
            ),
            multiple=False,
        ),
        html.Div(id="output-data-upload"),
    ],
)

使用 dash.testing 进行 Dash 测试 dcc.upload

Dash testing dcc.upload with dash.testing

python

selenium

dashboard

plotly-dash