{"action":"created","issue":{"url":"https://api.github.com/repos/ariya/phantomjs/issues/12779","repository_url":"https://api.github.com/repos/ariya/phantomjs","labels_url":"https://api.github.com/repos/ariya/phantomjs/issues/12779/labels{/name}","comments_url":"https://api.github.com/repos/ariya/phantomjs/issues/12779/comments","events_url":"https://api.github.com/repos/ariya/phantomjs/issues/12779/events","html_url":"https://github.com/ariya/phantomjs/issues/12779","id":50326522,"number":12779,"title":"3D CSS Transforms not working","user":{"login":"martinzaleski","id":6644714,"avatar_url":"https://avatars2.githubusercontent.com/u/6644714?v=4","gravatar_id":"","url":"https://api.github.com/users/martinzaleski","html_url":"https://github.com/martinzaleski","followers_url":"https://api.github.com/users/martinzaleski/followers","following_url":"https://api.github.com/users/martinzaleski/following{/other_user}","gists_url":"https://api.github.com/users/martinzaleski/gists{/gist_id}","starred_url":"https://api.github.com/users/martinzaleski/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/martinzaleski/subscriptions","organizations_url":"https://api.github.com/users/martinzaleski/orgs","repos_url":"https://api.github.com/users/martinzaleski/repos","events_url":"https://api.github.com/users/martinzaleski/events{/privacy}","received_events_url":"https://api.github.com/users/martinzaleski/received_events","type":"User","site_admin":false},"labels":[{"id":201512688,"url":"https://api.github.com/repos/ariya/phantomjs/labels/1.x","name":"1.x","color":"94b8d1","default":false},{"id":201512745,"url":"https://api.github.com/repos/ariya/phantomjs/labels/2.0","name":"2.0","color":"52a6e0","default":false},{"id":201512461,"url":"https://api.github.com/repos/ariya/phantomjs/labels/New%20Feature","name":"New Feature","color":"91ca55","default":false},{"id":201514175,"url":"https://api.github.com/repos/ariya/phantomjs/labels/Qt/Webkit","name":"Qt/Webkit","color":"BFD4F2","default":false},{"id":201513946,"url":"https://api.github.com/repos/ariya/phantomjs/labels/Webkit","name":"Webkit","color":"bfd4f2","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":16,"created_at":"2014-11-27T22:25:07Z","updated_at":"2017-07-25T10:27:00Z","closed_at":null,"body":"Hello!\nWhen I try yo capture a page where CSS 3D Transforms are applied to certain elements, it doesn't look good. I think I've read PhantomJS does not support 3D Transforms yet.\n\nAre you planning to support this feature or is there any workaround you could think of?\n\nThank you very much and keep up the good work!\nMartin\n"},"comment":{"url":"https://api.github.com/repos/ariya/phantomjs/issues/comments/317696490","html_url":"https://github.com/ariya/phantomjs/issues/12779#issuecomment-317696490","issue_url":"https://api.github.com/repos/ariya/phantomjs/issues/12779","id":317696490,"user":{"login":"hyrious","id":8097890,"avatar_url":"https://avatars3.githubusercontent.com/u/8097890?v=4","gravatar_id":"","url":"https://api.github.com/users/hyrious","html_url":"https://github.com/hyrious","followers_url":"https://api.github.com/users/hyrious/followers","following_url":"https://api.github.com/users/hyrious/following{/other_user}","gists_url":"https://api.github.com/users/hyrious/gists{/gist_id}","starred_url":"https://api.github.com/users/hyrious/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/hyrious/subscriptions","organizations_url":"https://api.github.com/users/hyrious/orgs","repos_url":"https://api.github.com/users/hyrious/repos","events_url":"https://api.github.com/users/hyrious/events{/privacy}","received_events_url":"https://api.github.com/users/hyrious/received_events","type":"User","site_admin":false},"created_at":"2017-07-25T10:27:00Z","updated_at":"2017-07-25T10:27:00Z","body":"I've noticed (maybe) a bug just now. Using `perspective` `border: 2px solid blue` on an element, then it's border-color will cover the whole background. Try capture:\r\n```html\r\n<!DOCTYPE html>\r\n  <style>\r\n    .a {\r\n      margin: 30px; padding: 20px;\r\n      display: inline-block;\r\n      font-size: 2rem; font-weight: 900;\r\n      border: 2px solid #369;\r\n      border-radius: 16px;\r\n      background-color: #EEE;\r\n      box-shadow: 0 0 6px black;\r\n      -webkit-transform: perspective(600px) rotateX(-10deg) rotateY(10deg);\r\n      transform: perspective(600px) rotateX(-10deg) rotateY(10deg);\r\n    }\r\n  </style>\r\n  <div class=\"a\">Lorem ipsum</div>\r\n```\r\nAnd this (bug) will not happen when `border-width <= 1px` or not using `perspective`.\r\nHere the sample capture:\r\n![y](https://user-images.githubusercontent.com/8097890/28567869-6c1a9c3a-7166-11e7-9ca6-04d19c242c0d.png) (real browser)\r\n![n](https://user-images.githubusercontent.com/8097890/28567879-723d5558-7166-11e7-8cd3-a7c66c28040c.png) (phantomjs)\r\nBTW, the `box-shadow` is also missing..."}}
{"actor":{"display_login":"hyrious"}}