Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

baseHref breakes html of head #13851

Closed
DzmVasileusky opened this issue Mar 7, 2019 · 7 comments · Fixed by #13869
Closed

baseHref breakes html of head #13851

DzmVasileusky opened this issue Mar 7, 2019 · 7 comments · Fixed by #13869
Labels
area: @angular-devkit/build-angular freq1: low Only reported by a handful of users who observe it rarely help wanted severity3: broken
Milestone

Comments

@DzmVasileusky
Copy link

🐞 Bug report

Command (mark with an x)

- [x] serve

Is this a regression?

Haven't noticed

Description

When adding baseHref parameter to angular.json config ng serve produce html with broken head layout.

🔬 Minimal Reproduction

index.pug

doctype html
html(lang="en")
    head(lang="en")
        meta(charset="UTF-8")
    body.no-background.crx-app: crx-app

compiles by pug.loader to
<!DOCTYPE html><html lang="en"><head lang="en"><meta charset="UTF-8"></head><body class="no-background crx-app"><crx-app></crx-app></body></html>

but served page HTML is
<!DOCTYPE html><html lang="en"><head lang="en"><<base href="/test/">meta charset="UTF-8"></head><body class="no-background crx-app"><crx-app></crx-app><script type="text/javascript" src="runtime.js"></script><script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="styles.js"></script><script type="text/javascript" src="scripts.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="main.js"></script></body></html>

<base href="/test/"> is inserted in <meta charset="UTF-8">

part of config

"build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
                    "baseHref": "/test/",
          }
}

🌍 Your Environment




Angular CLI: 7.3.3
Node: 8.11.4
OS: darwin x64
Angular: 7.2.7
@skreborn
Copy link

skreborn commented Mar 7, 2019

Seems to be inserted here if it helps with the investigation. In the meantime, can you provide a reproduction, @DzmVasileusky? A minimal repository, not just instructions, if possible.

@DzmVasileusky
Copy link
Author

@skreborn I'll try to prepare something
I guess maybe +1 is excess in headElement.__location.startTag.endOffset + 1

@skreborn
Copy link

skreborn commented Mar 7, 2019

I would assume that the + 1 is on purpose, as headElement.__location.startTag.endOffset should mark the very last character of the opening tag, so that plus one should point at the correct location.

@DzmVasileusky
Copy link
Author

It depends on how insert method is working.
However the bug can be in endOffset calculation as well. I'll try to come with a repo to work further

@DzmVasileusky
Copy link
Author

@alan-agius4
You have already noticed it. Cool.
I just have created simple repo and figured it out also.
Insertion lacks when it's a single line without spaces and line breakes

vikerman pushed a commit that referenced this issue Mar 11, 2019
… is in a single line

When HTML is in a single line using offset + 1 will cause the insertion of the base href tag in the wrong possition.

Fixes #13851
vikerman pushed a commit that referenced this issue Mar 13, 2019
… is in a single line

When HTML is in a single line using offset + 1 will cause the insertion of the base href tag in the wrong possition.

Fixes #13851
@DzmVasileusky
Copy link
Author

DzmVasileusky commented Mar 19, 2019

It seems that the issue still reproducable when base href in presented in the html.
It's not a critical issue since this is more like an edge case but still.

<!DOCTYPE html><html lang="en"><head lang="en"><meta charset="UTF-8"><base href="/test/"></head><body class="no-background crx-app"><crx-app></crx-app></body></html>

but served page HTML is
<!DOCTYPE html><html lang="en"><head lang="en"><meta charset="UTF-8"><base href="/lease/">/head><body class="no-background crx-app"><crx-app></crx-app><script type="text/javascript" src="runtime.js"></script><script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="styles.js"></script><script type="text/javascript" src="scripts.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="main.js"></script></body></html>

Should be added to testcases probably

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: @angular-devkit/build-angular freq1: low Only reported by a handful of users who observe it rarely help wanted severity3: broken
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants