{"action":"opened","issue":{"url":"https://api.github.com/repos/jsdom/jsdom/issues/2223","repository_url":"https://api.github.com/repos/jsdom/jsdom","labels_url":"https://api.github.com/repos/jsdom/jsdom/issues/2223/labels{/name}","comments_url":"https://api.github.com/repos/jsdom/jsdom/issues/2223/comments","events_url":"https://api.github.com/repos/jsdom/jsdom/issues/2223/events","html_url":"https://github.com/jsdom/jsdom/issues/2223","id":321437275,"number":2223,"title":"JSDom can't set and retrieve CSS styles","user":{"login":"OlofT","id":1730047,"avatar_url":"https://avatars1.githubusercontent.com/u/1730047?v=4","gravatar_id":"","url":"https://api.github.com/users/OlofT","html_url":"https://github.com/OlofT","followers_url":"https://api.github.com/users/OlofT/followers","following_url":"https://api.github.com/users/OlofT/following{/other_user}","gists_url":"https://api.github.com/users/OlofT/gists{/gist_id}","starred_url":"https://api.github.com/users/OlofT/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/OlofT/subscriptions","organizations_url":"https://api.github.com/users/OlofT/orgs","repos_url":"https://api.github.com/users/OlofT/repos","events_url":"https://api.github.com/users/OlofT/events{/privacy}","received_events_url":"https://api.github.com/users/OlofT/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-05-09T05:39:21Z","updated_at":"2018-05-09T05:39:21Z","closed_at":null,"author_association":"NONE","body":"### Basic info:\r\n\r\n- **Node.js version:** v10\r\n- **jsdom version:** v11.10\r\n\r\n### Minimal reproduction case\r\n\r\nAs the title says, I can't set css styles, and get them later. It's sad since it means you can't use JSDom to inline your CSS. \r\n\r\nAt least its easy to reproduce:\r\n\r\n```js\r\nconst { JSDOM } = require(\"jsdom\");\r\n\r\nconst options = {\r\nurl: \"http://localhost/\",\r\n\t\treferrer: \"http://aggressive.se\",\r\n\t\tcontentType: \"text/html\",\r\n\t\tuserAgent: \"AggressiveDev\",\r\n\t\tincludeNodeLocations: false,\r\n\t\tresources: \"usable\",\t\t\r\n\t\tpretendToBeVisual: true,\r\n\t\trunScripts: \"dangerously\",\r\n};\r\nconst dom = new JSDOM(`<body></body>`, options);\r\n\r\nwindow = dom.window\r\ndocument = window.document;\r\nvar styleSheet = document.createElement(\"style\");\r\nstyleSheet.setAttribute('type', 'text/css');\r\nvar head = document.getElementsByTagName(\"head\")[0];\r\nhead.appendChild(styleSheet);\r\nstyleSheet = document.styleSheets[document.styleSheets.length - 1];\r\n\r\nstyleSheet.insertRule(\".workingClass {  dontAddThis }\", 0);\r\nvar rule = styleSheet.cssRules[0];\r\nvar style = rule.style;\r\nstyle.borderColor = \"green\";\r\n\r\nconsole.log(\"rule.cssText gets selector but no css\");\r\nconsole.log(rule.cssText);\r\nconsole.log(\"should be:\\n.workingClass {border-color: green;}\");\r\n\r\nconsole.log(\"but using setProperty works (almost)\");\r\nstyle.setProperty(\"borderColor\", \"green\")\r\nconsole.log(rule.cssText);\r\nconsole.log(\"cssText is wrong (still js keys)\");\r\n\r\n```\r\n\r\n<!--\r\nYou can also use the old API in your repro case, as long as you are using\r\nv10 or above\r\n\r\nPlease create a minimal repro. Any reports involving third party libraries\r\nwill be closed, as we cannot debug third-party library interactions for you.\r\n\r\nPlease do not use syntax that is not supported in Node.js, such as JSX or\r\n`import` statements. If we cannot run the code in Node.js, we will close the\r\nissue, as we cannot debug whatever toolchain you are using.\r\n-->\r\n\r\n### How does similar code behave in browsers?\r\n(can be copy/pasted into browser after removing \"window = dom.window\") or jsbin:\r\nhttps://jsbin.com/sumadul/edit?js,console"}}
{"actor":{"display_login":"OlofT"}}