{"action":"created","issue":{"url":"https://api.github.com/repos/4Catalyzer/astroturf/issues/56","repository_url":"https://api.github.com/repos/4Catalyzer/astroturf","labels_url":"https://api.github.com/repos/4Catalyzer/astroturf/issues/56/labels{/name}","comments_url":"https://api.github.com/repos/4Catalyzer/astroturf/issues/56/comments","events_url":"https://api.github.com/repos/4Catalyzer/astroturf/issues/56/events","html_url":"https://github.com/4Catalyzer/astroturf/issues/56","id":368269831,"node_id":"MDU6SXNzdWUzNjgyNjk4MzE=","number":56,"title":"Component API props are passed to DOM element","user":{"login":"killbillsbor","id":10763681,"node_id":"MDQ6VXNlcjEwNzYzNjgx","avatar_url":"https://avatars0.githubusercontent.com/u/10763681?v=4","gravatar_id":"","url":"https://api.github.com/users/killbillsbor","html_url":"https://github.com/killbillsbor","followers_url":"https://api.github.com/users/killbillsbor/followers","following_url":"https://api.github.com/users/killbillsbor/following{/other_user}","gists_url":"https://api.github.com/users/killbillsbor/gists{/gist_id}","starred_url":"https://api.github.com/users/killbillsbor/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/killbillsbor/subscriptions","organizations_url":"https://api.github.com/users/killbillsbor/orgs","repos_url":"https://api.github.com/users/killbillsbor/repos","events_url":"https://api.github.com/users/killbillsbor/events{/privacy}","received_events_url":"https://api.github.com/users/killbillsbor/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":11,"created_at":"2018-10-09T15:29:56Z","updated_at":"2018-10-10T15:41:59Z","closed_at":null,"author_association":"NONE","body":"Hi!\r\n\r\nThanks for the best css-in-js library! We're using Component API in our application, and I noticed odd behaviour in a new version: all props matching css classes are passed to DOM elements. As far as I remember astroturf filtered props earlier.\r\n\r\nExample:\r\n\r\n```js\r\nlet Base = styled.div`\r\n  position: relative;\r\n  …\r\n  &.isBig {\r\n    size: 32px;\r\n  }\r\n`\r\n\r\n…\r\nreturn React.createElement(Base, { isBig }, …)\r\n```\r\n\r\nAnd now I'm getting:\r\n\r\n```\r\nWarning: React does not recognize the `isBig` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `isbig` instead. If you accidentally passed it from a parent component, remove it from the DOM element.\r\n```\r\n\r\nIs it correct behaviour and we have to filter props manually?\r\n\r\nThanks!"},"comment":{"url":"https://api.github.com/repos/4Catalyzer/astroturf/issues/comments/428623169","html_url":"https://github.com/4Catalyzer/astroturf/issues/56#issuecomment-428623169","issue_url":"https://api.github.com/repos/4Catalyzer/astroturf/issues/56","id":428623169,"node_id":"MDEyOklzc3VlQ29tbWVudDQyODYyMzE2OQ==","user":{"login":"taion","id":3112159,"node_id":"MDQ6VXNlcjMxMTIxNTk=","avatar_url":"https://avatars0.githubusercontent.com/u/3112159?v=4","gravatar_id":"","url":"https://api.github.com/users/taion","html_url":"https://github.com/taion","followers_url":"https://api.github.com/users/taion/followers","following_url":"https://api.github.com/users/taion/following{/other_user}","gists_url":"https://api.github.com/users/taion/gists{/gist_id}","starred_url":"https://api.github.com/users/taion/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/taion/subscriptions","organizations_url":"https://api.github.com/users/taion/orgs","repos_url":"https://api.github.com/users/taion/repos","events_url":"https://api.github.com/users/taion/events{/privacy}","received_events_url":"https://api.github.com/users/taion/received_events","type":"User","site_admin":false},"created_at":"2018-10-10T15:41:59Z","updated_at":"2018-10-10T15:41:59Z","author_association":"MEMBER","body":"Well, the thing we're missing is that if we do something like:\r\n\r\n```js\r\nconst Widget = styled('div')`\r\n  &.theme-foo {\r\n    color: red;\r\n  }\r\n`;\r\n```\r\n\r\nThen we would pass through `theme` when we do `<Widget theme={null}>`. I think to handle this, we'd have to iterate through and split the names of the defined classes."}}
{"actor":{"display_login":"taion"}}