Skip to content
This repository has been archived by the owner on Sep 6, 2021. It is now read-only.

Live preview issue - page displayed multiple times #8151

Open
casterle opened this issue Jun 17, 2014 · 12 comments
Open

Live preview issue - page displayed multiple times #8151

casterle opened this issue Jun 17, 2014 · 12 comments

Comments

@casterle
Copy link

I'm using Brackets sprint 40 with Chrome 35.0.1916.153m. The problem I'm having is that sometimes Chrome does not update the displayed page, but instead postpends my changes to the bottom of the existing page.

For example, if I have a page that displays:

1

and I edit the page in Brackets, sometimes Chrome will display:

2

This occurs fairly often, perhaps 10% of my edits; refreshing the page fixes the issue. I just learning HTML/CSS so all of my pages to date have been static.

Here's the HTML that most recently caused the issue:

html

BTW, Brackets is an outstanding learning tool! Thank you all for such a great gift!

@peterflynn
Copy link
Member

Here's the code as text, pulled from the newsgroup thread:

(@casterle, fyi you can use Markdown formatting syntax to include code in a bug report while preserving formatting)

<!doctype html>
<html lang="en">

<head>
   <meta charset="utf-8">
   <title>List test</title>
</head>

<body>
   <ol start="">
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3
         <ol>
            <li>item 1</li>
            <li>item 2</li>
            <li>item 3</li>
         </ol>
      </li>
      <li>item 4</li>
      <li>item 5</li>
      <li>item 6</li>
   </ol>
   <h3>Definition lists</h3>
   <dl>
      <dt>Term 1</dt>
      <dd>Definition 1</dd>
      <dt>Term 2</dt>
      <dd>Definition 2</dd>
      <dt>Term 3</dt>
      <dd>Definition 3</dd>
   </dl>
</body>

</html>

@njx
Copy link

njx commented Jun 17, 2014

@casterle I just tried this and wasn't able to reproduce it with simple edits. Do you know of a specific sequence of edits that could reliably reproduce the bug? Or do you have a sense of the kinds of edits you've been commonly doing that you could describe? (e.g. copying/pasting list items, adding attributes, deleting items, changing tag types, etc.)

@casterle
Copy link
Author

I haven’t been able to correlate the issue to any specific editing activity. I often don’t notice the issue immediately because the duplication is added to the bottom of the page and is thus sometimes not obvious.

Everything I’ve been doing is very simple as one might expect of a student – I’ve not even gotten into the HTML5-specific elements yet. I’ll try to pay more attention to what I am doing when I see the problem in the future.

Before reporting the issue I uninstalled and reinstalled both Chrome and Brackets; no joy.

From: Narciso Jaramillo [mailto:[email protected]]
Sent: Tuesday, June 17, 2014 16:38
To: adobe/brackets
Cc: casterle
Subject: Re: [brackets] Live preview issue - page displayed multiple times (#8151)

@casterle https://github.com/casterle I just tried this and wasn't able to reproduce it with simple edits. Do you know of a specific sequence of edits that could reliably reproduce the bug? Or do you have a sense of the kinds of edits you've been commonly doing that you could describe? (e.g. copying/pasting list items, adding attributes, deleting items, changing tag types, etc.)


Reply to this email directly or view it on GitHub #8151 (comment) . https://github.com/notifications/beacon/4976282__eyJzY29wZSI6Ik5ld3NpZXM6QmVhY29uIiwiZXhwaXJlcyI6MTcxODY2Mzg2OSwiZGF0YSI6eyJpZCI6MzQ4ODEyNTh9fQ==--b0f694f83f075f0dd1d8edbc154fdfec55b83002.gif

@casterle
Copy link
Author

Here's another datapoint. I installed Brackets on a different computer and ran into the same issue. Same versions of Chrome/Brackets. Both computers are i7's running Win7 Ultimate x64 w/latest updates.

@casterle
Copy link
Author

The problem seems to be caused by jsbeautifier - whenever I beautify my code the issue occurs. I've opened an issue here: taichi/brackets-jsbeautifier#4

@njx
Copy link

njx commented Jun 18, 2014

Hmmm, interesting - thanks for narrowing that down. That might still be our bug - if the only thing jsbeautifier is doing is making simple text edits, we should be able to handle that (especially if it's just changing whitespace). I'm going to reopen this so we can see if it's on our end.

@jeremy-beliez
Copy link

The bug is always here (taichi/brackets-jsbeautifier#4 and brackets-beautify/brackets-beautify#49). So beautifier are unusable.

Is it possible to have a working built-in beautifier option in Brackets ?

Thanks.

@Hirse
Copy link

Hirse commented Nov 1, 2015

The same issue appears on my beautify-fork: Hirse/brackets-beautify#14

As far as I was able to find out, this is the same as this Brackets issue: #10634
The beautifiers change the whole document including the html tag, which causes LivePreview to not update properly.

@bplus
Copy link

bplus commented Jun 12, 2016

Has anyone seen a fix for this? I'm experiencing the same thing.

@Hirse
Copy link

Hirse commented Jun 13, 2016

Added a work-around here: Hirse/brackets-beautify@3b9dc39

Should be available in the latest version of https://github.com/brackets-beautify/brackets-beautify.

@cdokolas
Copy link

cdokolas commented Aug 2, 2016

I have this problem only when I save the file.

Brackets Release 1.7 build 1.7.0-16898 (release b0a363b)
Chrome Version 52.0.2743.82 m (happens on FF as well)

Observations:

With developer mode on, I see something like this:

<html data-brackets-id="97"><head data-brackets-id="98">
    <style data-brackets-id="99">
        body {
            background-color: #ffcb05ff;
        }
    </style>
</head>

<body data-brackets-id="100">
    <p data-brackets-id="101">Some stuff</p>
    <p data-brackets-id="102">Hello</p>
</body>
</html>

I then have to turn off developer mode and re-enable live preview, because developer mode closes live preview.

After a small edit and "save", I see this (in developer mode):

<html data-brackets-id="127"><head data-brackets-id="128">
    <style data-brackets-id="123">
        body {
            background-color: #ffcb05ff;
        }
    </style>

    <style data-brackets-id="129">
        body {
            background-color: #ffcb05ff;
        }
    </style>
</head>

<body data-brackets-id="130">
    <p data-brackets-id="125">Some stuff</p>
    <p data-brackets-id="126">Hello, world</p>
    <p data-brackets-id="131">Some stuff</p>
    <p data-brackets-id="132">Hello, world</p>
</body>
</html>

What I've found out is that, as long as I don't cause live preview to stop, I can reload the page and get the right content.

It looks like saving the document clears and re-generates the internal node ids, which the live preview updating engine can't find and ends up just creating and appending new nodes to the document. So, the only workaround is to also reload the page every time I save...

@imiMike
Copy link

imiMike commented Jul 7, 2017

I've got the same issue in Release 1.9 build 1.9.0-17312 (release 189f6d3)
It seems to me that it happens when I edit the same file in the split mode - so the same file is opened in both views (left and right vertical split).
The live view is switched on the left view, when I edit the document in the right view and hit enter ( to add a new line) then chrome refreshes the document and duplicates the content of body tag.
I have to reload the page every time in chrome to fix that.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

11 participants