Testing URL fragment with the new framework

Using Streamlit
1

Hello Streamlit Community,

I’m currently working on testing a Streamlit app and have encountered a challenge with a particular functionality that i’m using in my app. I’m reaching out for guidance or suggestions from the community.

App: https://magiclit.streamlit.app
Github: GitHub - Mortafix/MagicLit: Supercharge Streamlit with MagicLit: Unlock the full potential of the framework for captivating and interactive web applications.

Funcionality

To navigate the app in a super fast way I’m using the URL fragment provided by this package.

from streamlit_url_fragment import get_fragment
from pages import profile, dashboard, error

def fragment_to_page(fragment): ...

def run_page(page):
  pages = {"profile": profile, "dashboard": dashboard}
  return pages.get(page, error)

st.markdown("<a href='#url@page=profile'>Page</a>", unsafe_allow_html=True)

fragment = get_fragment()
page = fragment_to_page(fragment)
script = run_page(page)
script.run()

When I click on the a tag, this simple script decide which page (in the example, the profile page).
You can try this behavior in the public Streamlit Cloud app.

Problem

I read all the guides and docs to the new Streamlit testing framework, but I can’t find anything to test this functionality. I know it’s not a straightforward Streamlit functionality, but I really love the new testing framework and I want to use it!

There is a way to test it? If no, is there a plan to include it in the near future?

I appreciate any help or insights the Streamlit community can offer. Thank you in advance for your time and assistance.

2

I hope for a reply :pray:
@dataprofessor or @jcarroll?

3

Hey @Mortafix,

Today we don’t have a way to test custom components like streamlit-url-fragment via AppTest explicitly.

There are two main approaches to consider:

  • To test just the logic of how your app handles the fragment return value, you could do a unittest.mock.patch() decorator on your test function to set a mock return value for streamlit_url_fragment.get_fragment in your test.
  • To test the actual custom component code e2e, you’d need to use another testing framework like playwright

I’m not sure how we would integrate custom component testing natively into AppTest but I’d welcome a feature request issue about this in GitHub so the community can weigh in about it. Let me know if you have further questions.

Thanks!

4

Thanks @jcarroll for the clarification!

I used Playwright in the past for this app, but it’s really to heavy to handle many tests.
I’ll try the mock decorator (i forgot about) for now!

Looking forward to testing custom component or, much better, native fragment handling :stuck_out_tongue:

5

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.