Deploying an interactive html app to streamlit


I’m trying to deploy an html app to streamlit cloud. Even if it currently works in local host, it doesn’t work in the cloud. Just showing an empty streamlit page. The app, whose details are here GitHub - mskilab/gGnome: R API for browsing, analyzing, and manipulating reference-aligned genome graphs in a GenomicRanges framework, is as follows:

Before any streamlit intervention, the app was working with a simple bash script that contains

open http://localhost:8080/index.html
npm start

and it has the files index.html, package.json, server.js, index.js etc.

My first naive attempt was to just call['bash','/gGnome.js/']) in a python script. Even if it works locally, it doesn’t work in the cloud. So, I follow the suggestions mentioned here: Showing a pyLDAvis html - #3 by ghass002

I did

import streamlit as st
import streamlit.components.v1 as components

html_string = 'index.html' # load your HTML from disk here

in, but it doesn’t show anything even locally. I appreciate it if someone can tell me how to do it.

P.S.: I pushed necessary files to github and streamlit has an access to it and the file as executable.

You need to pass actual HTML, not a file name.

ok, I did as you said, copy pasted the content of index.html as

  <meta charset="UTF-8">
  <script src="./js/fragment.js"></script>
  <script src="./js/regl-canvas.js"></script>

but it cannot access all the elements of it. I can only see the button titles in a disorganized way, drop down menu is empty etc. When i click the hyperlink. gGnome.js, it returns the error

You have requested page /index.html, but no corresponding file was found in the app's pages/ directory. 
Running the app's main page.

Looks like some files are not reachable from the current directory. You may have to adjust the paths.