Unexpected HTML changes



Just testing out v7 - started with a straightforward html template, added to Surreal and edited a table with data. I noted the following unexpected changes to the underlying html file and wanted to share thoughts.

  1. meta properties were added to the head - fair enough, I guess it improves my page

  2. the html has been reformatted - my personal style for indenting content in a certain way has been overwritten - I guess I can live with that. If the system is consistent then I will just get used to Surreal pages being formatted in their own way

  3. part of that reformatting includes adding line breaks so no line extends beyond circa 150 characters - per above, I’ll live with it.

  4. the table elements tr and td have had style properties added with explicit pixel heights and percentage widths - this I didn’t ask for. The table element itself also has an explicit pixel height specified and percentage width and now renders narrower than it did before my edit. Not happy about page appearance being modified when I am only editing text content within table cells.

  5. The copyright symbol at bottom of page was originally encoded as html © but in the modified page it appears as a single printed copyright symbol.

  6. Contrawise, every apostrophe which was typed as a single character in the original html has been replaced with the html code ' - again, not a fan of unrequested changes, but between this and the last point, perhaps a consistent approach is better than mixed? (Although my preference is to encode the copyright symbol, but not apostrophes, obviously).

  7. As an aside, in the editor, when I click “Drafts & Revisions”, the unedited html page (before my first edit through the CMS) is not available - this would be a nice feature to have.



The behavior is consistent, but it does rely on the page being published for the type of indentations that get added. From the 7.0 announcement:

When you publish a page, Surreal CMS will automatically cleanup and properly indent its source using js-beautify. The type of indentation (space/tab) is automatically detected, so you don’t need to configure anything.

Perhaps switching to Prettier and looking for a prettier.config.js file for the desired settings would be more convenient. :thinking:

This shouldn’t happen unless you specifically resize the table by dragging. Can you confirm that simply publishing the page without clicking any table borders is adding these values?

Version 7 uses a completely different HTML parser than previous versions. It’s really good and fast, and it also ensures encoding is handled consistently which means you’ll see little side effects like this. Despite it being unexpected, it won’t affect how the page is rendered :slight_smile: