mavoweb/mavo-ssr

Serving local Mavo apps

DmitrySharabin opened this issue · 7 comments

DmitrySharabin commented

Hello Brian! Thank you for your tool.
I gave it a try (as a prerenderer) and faced an issue. It might be I made smth wrong, so I'll try to describe what I did.
I have a site with a few Mavo apps (I use the local version of Mavo). Every page of the site is in a separate folder (with the index.html file inside it). If I try to follow the link like this one localhost:8080/about the SSR server doesn't serve it: the message Cannot GET /about appears in the browser. For example, BrowserSync serves such links without any problem.
If I change the link to localhost:8080/about/index.html, the corresponding page with a Mavo app in it loads, but the SSR server doesn't detect it: the message Headless detected no Mavo; returned page http://localhost:8000//about/index.html with 18637 chars in 4711ms in the terminal.
Will you please help me?

P.S. I was not sure how to entitle the issue. Sorry if I did it wrong.

betaveros commented

I'll think about the URL issue, but I'm not sure about serving /about/index.html for the path /about. (/about/ should certainly work, but I have more often seen /about mapping to /about.html if it exists, since this preserves relative paths.)

Are you loading mavo.js asynchronously, by any chance? I don't think SSR will currently work in that case. If not, it would be helpful if you could provide a complete Mavo app that can reproduce the issue.

DmitrySharabin commented

/about/ should certainly work

That works like a charm! Thank you. My mistake. 😅

Are you loading mavo.js asynchronously, by any chance?

Nope. I simply use <script src="../js/mavo.min.js"></script> in the <head> element of the page.

I will definitely provide you reduced testcase in a while. Thanks for your help!

DmitrySharabin commented

I have found the problem. It's on my side. On every page of my site, I use a third-party script (to track visits) which is loading asynchronously. When I removed it, the server found the Mavo app, and everything worked as it should.
Is there a chance SSR could manage such cases in the future so we could use scripts that are being loaded asynchronously?

betaveros commented

I still can't reproduce. Can you provide an example still? Do you get anything interesting if you pass the --verbose or --no-headless flags when serving?

I was just trying to reproduce with an HTML page like

<!DOCTYPE html>
<html lang="en">
<head>
	<link rel="stylesheet" href="https://dev.mavo.io/dist/mavo.css">
	<script src="https://dev.mavo.io/dist/mavo.js"></script>
</head>
<body>
	<div mv-app="test">
		[2 + 3]
	</div>
	<script src="async.js" async></script>
</body>
</html>

and async.js

console.log('hello');
DmitrySharabin commented

Unfortunately, I can't reproduce the issue either. But I still have a site that illustrates the problem.
I'm sorry but it's in Russian, so I recorded a screencast to show you which pages have Mavo apps. There are two pages with Mavo apps: practices and advice.
Here is the site:
dist.zip
And here is the screencast:
screencast.mov.zip

betaveros commented

I believe the linked commit fixes this issue. Let me know if you still run into it.

DmitrySharabin commented

Everything is perfect! Thank you very much.