Bug: result-utils included in exported source
aehlke opened this issue · comments
Describe the bug
When I use the SDK to export the built source, I don't expect result-utils to be included when it has logic that only applies for running inside of the livecodes iframe sandbox.
Steps to reproduce
Configure a simple project with HTML/JS. Export the source code via SDK and run standalone in a new browser tab.
Affected services
LiveCodes App, LiveCodes SDK
Platforms
No response
Browsers
No response
Environment
No response
Share URL(s)
No response
Configuration
No response
Additional context
No response
Is it already fixed?
None
Code of Conduct
- I agree to follow this project's Code of Conduct
Contributing Docs
- I agree to follow this project's Contribution Docs
Yes, I confirm your finding. This should be fixed soon.
Thanks for reporting.
@aehlke
that is now fixed
You may try it with the appUrl
: https://dev.livecodes.io
<div id="container"></div>
<script type="module">
import { createPlayground } from 'https://unpkg.com/livecodes@0.1.2';
createPlayground('#container', {
appUrl: 'https://dev.livecodes.io',
params: {
markdown: '# Hello LiveCodes!',
css: 'h1 {color: blue;}',
},
}).then(async (playground) => {
console.log((await playground.getCode()).result);
});
</script>
this should be available on livecodes.io in the next release.
thank you again for reporting.
Thanks very much! I will confirm soon.
I applied your patch to my livecodes fork (which is still a few weeks behind, but it looked like your changes in this PR could be applied cleanly), but it still loads results-util.html and shows it's being used in the console...
Here is my usage:
let playground = await playgroundPromise;
await playground.setConfig({
markup: { language: markupLanguage, content: markupContent },
style: { language: styleLanguage, content: styleContent },
script: { language: scriptLanguage, content: scriptContent },
});
let code = await playground.getCode();
let resultPageHTML = code.result;
return resultPageHTML;
I'll try upgrading to latest livecodes next but I suspect I'll see the same issue
Never mind my last message, must have had something cached - looks like it's working now, thank you
I have just released app v13 and SDK v0.2.0, which have the fix among other improvements: https://github.com/live-codes/livecodes/releases
this is your sample with minimal changes:
<div id="container"></div>
<script type="module">
import { createPlayground } from "https://unpkg.com/livecodes@0.2.0";
let playground = await createPlayground("#container");
await playground.setConfig({
markup: { language: "html", content: "hi" },
style: { language: "css", content: "body { color: blue; }" },
script: { language: "js", content: 'console.log("hi");' },
});
let code = await playground.getCode();
let resultPageHTML = code.result;
console.log(resultPageHTML);
</script>
This is the console output:
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Untitled Project</title><style id="__livecodes_styles__">body { color: blue; }</style></head><body>hi<script>console.log("hi");</script></body></html>
This version also introduced a headless mode which opens a lot of capabilities.
In the last example you would just change this:
let playground = await createPlayground("#container");
to this
let playground = await createPlayground({ view: 'headless' });
Amazing, thanks for the update!
I'm already hiding these webviews in my app such that I'm not sure there's a functional/user-facing difference with headless mode for my usage, but this simplifies the integration a bit and lightens resource usage I'm sure, so that's appreciated. I'll try it soon.
Indeed there is a definite performance advantage for using headless mode, where all resources required for the UI are not loaded.