Stephanevg/PSHTML

External CSS using link function is not working as expected.

Closed this issue · 7 comments

ChendrayanV commented

Issue: External CSS using link function is not working as expected.

Steps to Reproduce:

  • Create a folder named iPortal
  • Underneath iPortal created three PS1 files as listed below
    home.css
    home.ps1
    WebServer.ps1

home.css

h1 {
    text-align: center;
    color: blueviolet
}

home.ps1

html {
    head {
        title "iPortal Home Page"
        link -href "home.css" -rel "stylesheet"
    }
    body {
        h1 "iPortal"
    }
}

WebServer.ps1

Import-Module C:\Projects\PSHTML\pshtml.psd1 -Verbose
Import-Module Polaris -Verbose
$Url = "http://localhost:8080"
New-PolarisGetRoute -Path "/home" -Scriptblock {
    $Response.SetContentType('text/html')
    $Html = .\home.ps1
    $Response.Send($Html)
}
Start-Polaris 8080

CSS is not applied in GET route rendered page!

Workaround - Using Style Function - This worked for now!
home.css

html {
    head {
        title "iPortal Home Page"
        # link -href "home.css" -rel "stylesheet"
        style (Get-Content .\home.css)
    }
    body {
        h1 "iPortal"
    }
}
Stephanevg commented

What is the exact output that you get, when you run it outside of polaris?
Could you send the complete HTML page?

Stephanevg commented

Also, you could try to use baseelement to define the base, for all the relative paths of your HTML document.
You can read more about it here --> The tag specifies the base URL/target for all relative URLs in a document.

There can be at maximum one element in a document, and it must be inside the element.

ChendrayanV commented

What is the exact output that you get, when you run it outside of polaris?
Could you send the complete HTML page?

Here is the HTML File: Its; working fine as static HTML file

<html>

<head>
    <title>iPortal Home Page</title>
    <link href="home.css" type="text/css" rel="stylesheet" Integrity="-">
</head>

<Body>
    <h1>
        iPortal Home Page
    </h1>
</Body>

</html>
Stephanevg commented

Hi @ChendrayanV
That actually means, that PSHTML is working just fine.
It seems that something inside of Polaris. I guess it is probably due to the relative path used combined with the Runspace magic they used.
Have you opened an issue there? If not, that would be really great!

ChendrayanV commented

Hi @Stephanevg

yes, I logged an issue over POLARIS repo and here is the issue link. for your reference!

Stephanevg commented

@ChendrayanV I saw in your issue on the Polaris Repo, that you had a workaround for your use case.
Perhaps it would make sense to add it in the help somewhere, so that the users know what to do in case they face that issue.
In the comment based help perhaps?
Also, wouldn't it make sense to have a: "known_issues.MD" on the repo somewhere? We could track in there the issues we have open (and the links to potentially other issues we opened on other repos) and to give that overview to the end users. What do you think?

  • 👍1
ChendrayanV commented

@Stephanevg - This issue can be closed! Thanks in advance!