Parse entry point of index.html and rewrite JS for serverless injection #58

nothingismagick · 2019-11-20T10:11:39Z

Is your feature request related to a problem? Please describe.
The problem is that different frameworks use different strategies for JS injection in the root app. In the serverless distribution type, we need to do some slight transformation to the JS in order to properly inject it.

Describe the solution you'd like
At build time (not dev because that is really served via webpack) we need to parse the source of the index.html for JS and transform the JS for injection. On a sidenote, this is also where we can inject the CSP meta value.

Describe alternatives you've considered
There are a couple of alternatives:

Write a type of app extension for every framework. This might be a stopgap solution if we can't get DOM / AST parsing to work the way we need it to. It would probably entail handcrafting the tauri entry index.html file, and it strikes me as the most brittle and error-prone.
Whitelist types of frameworks - which defeats the notion of being agnostic in serverless, which is really the claim to fame.

Additional context
In an earlier iteration I hand-crafted the entry file and totally ignored the index.html file that was shipping. Here is the example:

#[cfg(feature = "serverless")]
    {
      fn inline_style(s: &str) -> String {
        format!(r#"<style type="text/css">{}</style>"#, s)
      }

      fn inline_script(s: &str) -> String {
        format!(r#"<script type="text/javascript">{}</script>"#, s)
      }
      let html = format!(r#"<!DOCTYPE html><html><head><meta http-equiv="Content-Security-Policy" content="default-src data: filesystem: 'unsafe-eval' 'unsafe-inline'">{styles}</head><body><div id="q-app"></div>{scripts}</body></html>"#,
    styles = inline_style(include_str!("../target/compiled-web/css/app.css")),
    scripts = inline_script(include_str!("../target/compiled-web/js/app.js")),
  );
      content = tauri_ui::Content::Html(html);
    }
let webview = tauri_ui::builder()
  .title("Tauri POC")
  .size(800, 600)
  .resizable(true)
  .debug(debug)
  .content(content)

nothingismagick · 2019-11-20T10:29:11Z

As part of the build step, I sort of feel like the best approach will be to use node to parse the HTML using JSDOM something like this:

    const filePath = path.resolve(__dirname, `${theIndex.html}`)
    const readInterface = readline.createInterface({
      input: fs.createReadStream(`${filePath}`),
      terminal: false
    })
    readInterface.forEach((line) => {
      const { document } = (new JSDOM(line)).window
      let el = document.querySelector('script')
      ...
    }).catch(e => {
        console.log(e)
    }).finally(() => {
      // magick
    })

But obviously readLIne won't work all the time, so its just a preliminary sketch.

nothingismagick · 2019-11-20T14:00:53Z

Well, maybe the approach we can use to make the monolith here is to mung the index.html, looking for JS files and just directly inlining them. Whether or not we'd need to actually destructure dynamicImports is something to look at too.

lucasfernog · 2019-12-01T21:32:31Z

We are making some progress on the feature/iframe branch, it might be the best solution.

nothingismagick · 2019-12-17T11:38:38Z

@lucasfernog - I think that the merge of features/no-server resolves this.

lucasfernog closed this as completed Jul 18, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Parse entry point of index.html and rewrite JS for serverless injection #58

Parse entry point of index.html and rewrite JS for serverless injection #58

nothingismagick commented Nov 20, 2019

nothingismagick commented Nov 20, 2019 •

edited

Loading

nothingismagick commented Nov 20, 2019 •

edited

Loading

lucasfernog commented Dec 1, 2019

nothingismagick commented Dec 17, 2019

Parse entry point of index.html and rewrite JS for serverless injection #58

Parse entry point of index.html and rewrite JS for serverless injection #58

Comments

nothingismagick commented Nov 20, 2019

nothingismagick commented Nov 20, 2019 • edited Loading

nothingismagick commented Nov 20, 2019 • edited Loading

lucasfernog commented Dec 1, 2019

nothingismagick commented Dec 17, 2019

nothingismagick commented Nov 20, 2019 •

edited

Loading

nothingismagick commented Nov 20, 2019 •

edited

Loading