LayoutTests/compositing/anchor-point-should-not-affect-perspective.html - Issue 637763002: Unprefix usage of -webkit-transform in tests

Side by Side Diff

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Keyboard Shortcuts

	File
u :	up to issue
j / k :	jump to file after / before current file
J / K :	jump to next file with a comment after / before current file
	Side-by-side diff
i :	toggle intra-line diffs
e :	expand all comments
c :	collapse all comments
s :	toggle showing all comments
n / p :	next / previous diff chunk or comment
N / P :	next / previous comment
<Up> / <Down> :	next / previous line

	Issue
u :	up to list of issues
j / k :	jump to patch after / before current patch
o / <Enter> :	open current patch in side-by-side view
i :	open current patch in unified diff view

	Issue List
j / k :	jump to issue after / before current issue
o / <Enter> :	open current issue

Side by Side Diff: LayoutTests/compositing/anchor-point-should-not-affect-perspective.html

Issue 637763002: Unprefix usage of -webkit-transform in tests (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Remove duplicate transform Created 6 years, 2 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« LayoutTests/animations/3d/transform-origin-vs-functions.html ('K') | « LayoutTests/compositing/ancestor-painted-layer-should-appear-expected.html ('k') | LayoutTests/compositing/anchor-point-should-not-affect-perspective-expected.html » ('j') | LayoutTests/fast/layers/scroll-with-transform-composited-layer.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE HTML>	1 <!DOCTYPE HTML>

2 <style>	2 <style>

3 .transformableContainer {	3 .transformableContainer {

4 position: absolute;	4 position: absolute;

5 -webkit-perspective-origin: 50% 50%;	5 -webkit-perspective-origin: 50% 50%;

6 -webkit-perspective: 100;	6 -webkit-perspective: 100;

7 }	7 }

8 .transformable {	8 .transformable {

9 -webkit-transform-origin: 0em 0em 0em;	9 -webkit-transform-origin: 0em 0em 0em;

10 -webkit-transform-style: preserve-3d;	10 -webkit-transform-style: preserve-3d;

11 }	11 }

12 .transformed {	12 .transformed {

13 -webkit-transform: translate3d(100px, 100px, -25px);	13 transform: translate3d(100px, 100px, -25px);

14 }	14 }

15 .resetTransformOrigin {	15 .resetTransformOrigin {

16 -webkit-transform-origin: 50% 50% !important;	16 -webkit-transform-origin: 50% 50% !important;

17 }	17 }

18 </style>	18 </style>

19 <!--	19 <!--

20 The red div should be covered by the green. If the red is showing, there is	20 The red div should be covered by the green. If the red is showing, there is

21 an issue with the anchor point.	21 an issue with the anchor point.

22 -->	22 -->

23 <div class="transformableContainer transformable" style="width: 400px; height: 4 00px;">	23 <div class="transformableContainer transformable" style="width: 400px; height: 4 00px;">

24 <div class="transformable transformed">	24 <div class="transformable transformed">

25 <div class="content" style="width: 200px; height: 200px; background-color: r ed;"></div>	25 <div class="content" style="width: 200px; height: 200px; background-color: r ed;"></div>

26 </div>	26 </div>

27 </div>	27 </div>

28	28

29 <div class="transformableContainer resetTransformOrigin" style="width: 400px; he ight: 400px;">	29 <div class="transformableContainer resetTransformOrigin" style="width: 400px; he ight: 400px;">

30 <div class="transformable transformed">	30 <div class="transformable transformed">

31 <div class="content" style="width: 200px; height: 200px; background-color: g reen;"></div>	31 <div class="content" style="width: 200px; height: 200px; background-color: g reen;"></div>

32 </div>	32 </div>

33 </div>	33 </div>

OLD	NEW