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.

Sign up for GitHub

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

Jump to bottom

Invalid CSS rule error when using @font-face #1441

Open
yuki2006 opened this issue May 21, 2024 · 0 comments
Open

Invalid CSS rule error when using @font-face #1441

yuki2006 opened this issue May 21, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@yuki2006
Copy link
Sponsor

Describe the bug
When attempting to add a @font-face CSS rule using happy-dom, I encounter a HierarchyRequestError indicating that the CSS rule is invalid. The issue occurs when running the following code:

To Reproduce

index.js

import { Window } from 'happy-dom';

const window = new Window({
  url: 'https://localhost:8080',
});
const document = window.document;

const styleEl = document.createElement('style');

// Append <style> element to <head>
document.head.appendChild(styleEl);

const styles = `
@font-face {
  font-family: "Ionicons";
  src: url("~react-native-vector-icons/Fonts/Ionicons.ttf");
`;
styleEl.sheet?.insertRule(styles, 0);

// Close window
await window.happyDOM.close();

package.json

{
  "type": "module",
  "dependencies": {
    "happy-dom": "^14.11.0"
  }
}

Run
node index.js

Expected behavior
The @font-face rule should be successfully added to the document's stylesheet without any errors.

Actual Behavior:

The following error is thrown:

DOMException [HierarchyRequestError]: Invalid CSS rule.
    at CSSStyleSheet.insertRule (file:///Users/xxxx/happy/node_modules/happy-dom/lib/css/CSSStyleSheet.js:54:19)

Device:

  • OS: mac
  • Browser node
  • Version v20.9.0

Additional context

Personally, I don't care about font issues on happy-dom.
@yuki2006 yuki2006 added the bug Something isn't working label May 21, 2024
@yuki2006 yuki2006 changed the title Invalid CSS rule error when using @font-face with happy-dom Invalid CSS rule error when using @font-face May 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@yuki2006