Parsing issue when adding head and body tags

Ruulul commented 2 years ago

so, new lines are behaving strange only when you have a head + body tags.

<head>
    <title>Wrong Parsing</title>
</head>
<body>
    <input>
    <br>
    <span></span>
</body>
<script>
    let input = document.querySelector("input");
    let span = document.querySelector("span");
    input.oninput = event => span.innerHTML = event.target.value;
</script>

this parses good, but

<head>
    <title>Wrong Parsing</title>
</head>
<body>
    <input>
    <br>
    <span></span>
</body>
<script>
    let input = document.querySelector("input");
    let span = document.querySelector("span");

    input.oninput = event => span.innerHTML = event.target.value;
</script>

this one is parsed like

[...]
<script>
    let input = document.querySelector("input");
    let span = document.querySelector("span");

    <pre><code>input.oninput = event => span.innerHTML = event.target.value;
    </code></pre>
</script>

for some reason.

Again: If I remove the head and body tags, leaving only the body contents, this behaviour is not observed.

Also, I noticed Agregore is overwriting the title I wrote too.

RangerMauve commented 2 years ago

What are you using to load this file in Agregore?

As far as I'm aware you shouldn't be placing anything outside of the body tag like that, it might be triggering the browser to go into quirks mode.

Does the page load properly in Chromium?

Also, the html, head, and body tags are optional in HTML5 so you could have something that looks like this instead:

<!DOCTYPE html>
<title>Wrong Parsing</title>
    <input>
    <br>
    <span></span>
<script>
    let input = document.querySelector("input");
    let span = document.querySelector("span");
    input.oninput = event => span.innerHTML = event.target.value;
</script>

Ruulul commented 2 years ago

the file loads okay, even in agregore, if I open directly as a file url;

I uploaded the file with the ipfs cli with agregore as api, and used the ipfs url.

hmmm I will test removing the head and body tags

Ruulul commented 2 years ago

Tried removing the head and body; it nows dont mess with my script, but it is still inserting a title tag over the mine

RangerMauve commented 2 years ago

What does the title tag it's inserting look like? Is this happening at the ipfs add stage by any chance? Could you check if the document.contentType was text/html? I think sometimes stuff can be served as text/plain if there isn't a correct file extension, and then that would cause the markdown renderer to kick in

Ruulul commented 2 years ago

no, the file in the ipfs itself is untouchable;

... you found it!

contentType is text/html

Ruulul commented 2 years ago

<head><title>ipfs://bafkreiguwqwgtphyjt3wjdtsk5y7bfxccs6zrhvrneoszuewrgu5jmateu/</title>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html charset=utf-8">
<link rel="stylesheet" href="agregore://theme/style.css">
<link rel="stylesheet" href="agregore://theme/highlight.css">
<title>Chat app example</title>

<style>
    div, main, form {
        display: flex;
        flex-flow: column;
        width: 10em;
    }
    span {
        float: left;
    }
</style>
</head>

the title insertion (my file only has a shy <title> tag and this <style> tag too, all the rest in inserted)

RangerMauve commented 2 years ago

Try adding the file to a folder under the name index.html and then use ipfs add on the folder itself so that it'll properly resolve as an HTML file. 😅

RangerMauve commented 1 year ago

Feel free to reopen if you tried the above fix and it's still causing you trouble 👍

AgregoreWeb / agregore-browser

Parsing issue when adding head and body tags #203