Themes using incorrect base URL to load CSS files via style.js

[jonathanaustin]

When a theme loads CSS files via the "css" configuration, "relative" theme URLs are not being handled correctly.

Example of a theme using a custom CSS in its configuration:

dto = {
  inherit: true,
  css: {
      phone: {
        media: "only screen and (max-width: 773px)"
      }
  }
};
wcconfig.set(dto, "wc/loader/style");

This will try and load the custom "wc-phone.css". When an application is using the theme servlet and an application context the theme resources should be loaded via a "relative URL" like "theme/style/wc-phone.css".

However, the style.js script that handles the loading of the CSS is always appending a "/" at the front of the URL which makes the theme URL relative to the server and not the application context and therefore gets a "404" and file cannot be loaded.

style.js needs to be fixed that it does not prefix a relative theme URL with a "/".

To use the theme servlet, the relative theme path is set like this on the server side:

## Relative theme path to the theme servlet
bordertech.wcomponents.theme.content.path=theme/

A work around until this is fixed is to give the theme path the full server path to the theme servlet:

## Server theme path (where mycontext is the application server context)
bordertech.wcomponents.theme.content.path=/mycontext/theme/

[ricksbrown]

A way to simplify this might be to change this line:

return mainCss.getAttribute("href");

To this:

return mainCss.href;

That way you'll always be dealing with absolute URLs