[css-ui] Add support for caret-color property

The test basically adds the new CSS property "caret-color":
https://drafts.csswg.org/css-ui/#propdef-caret-color

"caret-color" is a regular color property but it accepts also "auto".
To support this a new class StyleAutoColor has been created,
including a new flag to know if the color is auto, currentColor
or a specified one.

Finally the patches modifies CaretBase::paintCaret() to use
that property instead of "color" as it's been doing until now.

We're using the test suite from the W3C CSS WG,
which was imported on r434986.
This CL manually imports some pixel tests too.

This is based on a patch by Claudio Saavedra <csaavedra@igalia.com>.

BUG=665422
TEST=editing/caret/caret-color-*.html
TEST=imported/csswg-test/css-ui-3/caret-color-*.html

Review-Url: https://codereview.chromium.org/2520873002
Cr-Commit-Position: refs/heads/master@{#435338}
diff --git a/third_party/WebKit/LayoutTests/TestExpectations b/third_party/WebKit/LayoutTests/TestExpectations
index a39375b..dc85667 100644
--- a/third_party/WebKit/LayoutTests/TestExpectations
+++ b/third_party/WebKit/LayoutTests/TestExpectations
@@ -1733,10 +1733,7 @@
 crbug.com/669473 imported/csswg-test/css-ui-3/box-sizing-019.html [ Failure ]
 crbug.com/669473 imported/csswg-test/css-ui-3/box-sizing-024.html [ Failure ]
 crbug.com/669473 imported/csswg-test/css-ui-3/box-sizing-025.html [ Failure ]
-crbug.com/669473 imported/csswg-test/css-ui-3/caret-color-009.html [ Failure ]
-crbug.com/669473 imported/csswg-test/css-ui-3/caret-color-013.html [ Failure ]
-crbug.com/669473 imported/csswg-test/css-ui-3/caret-color-016.html [ Failure ]
-crbug.com/669473 imported/csswg-test/css-ui-3/caret-color-018.html [ Failure ]
+crbug.com/669490 imported/csswg-test/css-ui-3/caret-color-018.html [ Failure ]
 crbug.com/669473 imported/csswg-test/css-ui-3/text-overflow-002.html [ Failure ]
 crbug.com/669473 imported/csswg-test/css-ui-3/text-overflow-004.html [ Failure ]
 
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-001.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-001.html
new file mode 100644
index 0000000..d52bda0
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-001.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color can be set on a textarea">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; color: white; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    caret-color: lime;
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <textarea autofocus></textarea>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-002.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-002.html
new file mode 100644
index 0000000..e13a620
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-002.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color is inherited</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color value does inherit">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; color: white; /* the color of a thin object like the caret is easier to see on a black background. */
+  }
+  div {
+    caret-color: lime;
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <div>
+    <textarea autofocus></textarea>
+  </div>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-003.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-003.html
new file mode 100644
index 0000000..ca22179
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-003.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color auto</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact should">
+<meta name="assert" content="Test checks that caret-color: auto matches currentColor">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    color: lime;
+    caret-color: auto; /*initial value, but to be sure in case the UA stylesheet sets something else */
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is green,
+  like the text in that textarea.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <textarea autofocus></textarea>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-004.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-004.html
new file mode 100644
index 0000000..1ec3a4a7
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-004.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color auto, black on white</title>
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color:auto provides good contrast in black on white">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+
+    background: white;
+    color: black;
+    caret-color: auto; /*initial value, but to be sure in case the UA stylesheet sets something else */
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is either black
+  or some other color that contrasts well with the background.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <textarea autofocus></textarea>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-005.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-005.html
new file mode 100644
index 0000000..4968ab2
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-005.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color auto, white on black</title>
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color:auto provides good contrast in white on black">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+
+    background: black;
+    color: white;
+    caret-color: auto; /*initial value, but to be sure in case the UA stylesheet sets something else */
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is either white
+  or some other color that contrasts well with the background.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <textarea autofocus></textarea>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-007.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-007.html
new file mode 100644
index 0000000..869fab1
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-007.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color: currentColor</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#currentcolor-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color:currentColor is inherited as currentColor and resolves to the value of the color property at used value time">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    color: lime;
+  }
+  div {
+    caret-color: currentcolor;
+    color: red;
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is green</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <div>
+    <textarea autofocus></textarea>
+  </div>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-010.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-010.html
new file mode 100644
index 0000000..21494ee
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-010.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color input</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color can be set on an input">
+<style>
+  input {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; color: white; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    caret-color: lime;
+  }
+</style>
+<body>
+  <p>Test passes if, when the input field below is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <input autofocus></input>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-011.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-011.html
new file mode 100644
index 0000000..a0ca95a
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-011.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color contenteditable</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color can be set on a contenteditable element">
+<style>
+  div {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; color: white; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    caret-color: lime;
+  }
+</style>
+<body>
+  <p>Test passes if, when when the editable element below is focused is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <div id="test" contenteditable>Focus this editable element</div>
+  <script>
+    window.onload = function() {
+      document.getElementById("test").focus();
+    }
+  </script>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-012.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-012.html
new file mode 100644
index 0000000..4688fef
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-012.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color: auto</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact should">
+<meta name="assert" content="Test checks that caret-color:auto is inherited as auto and resolves to the value of the color property at used value time">
+<style>
+  textarea {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    color: lime;
+  }
+  div {
+    caret-color: auto;
+    color: red;
+  }
+</style>
+<body>
+  <p>Test passes if, when the text area below is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <div>
+    <textarea autofocus></textarea>
+  </div>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-014.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-014.html
new file mode 100644
index 0000000..1607c36
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-014.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color links</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color can be set on a contenteditable link">
+<style>
+  a {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    color: white;
+    caret-color: lime;
+  }
+</style>
+<body>
+  <p>Test passes if, when the link is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <a id="link" contenteditable href="#">link</a>
+  <script>
+    window.onload = function() {
+      document.getElementById("link").focus();
+    }
+  </script>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-015.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-015.html
new file mode 100644
index 0000000..a5a9003
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-015.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color visited links</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<meta name="flags" content="interact">
+<meta name="assert" content="Test checks that caret-color can be set on a contenteditable visited link">
+<style>
+  a {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    color: white;
+    caret-color: red;
+  }
+
+  a:link {
+    color: yellow;
+  }
+
+  a:visited {
+    caret-color: lime;
+  }
+</style>
+<body>
+  <p>Before running this test, the link below must have been visited. It will have yellow text if this is not the case. If it its text is yellow, you need to navigate to this link first.
+  <p>Test passes if, when the link below is focused for editing, the text insertion caret is green.</p>
+  <p>The shape of the caret, and whether it flashes, are not part of the test.</p>
+  <!-- This is a copy of the W3C test just changing the href on the link, so Blink considers it a visited link. -->
+  <a id="link" contenteditable href="">link</a>
+  <script>
+    window.onload = function() {
+      document.getElementById("link").focus();
+    }
+  </script>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/caret/caret-color-016.html b/third_party/WebKit/LayoutTests/editing/caret/caret-color-016.html
new file mode 100644
index 0000000..e81bc08c
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/editing/caret/caret-color-016.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Basic User Interface Test: caret-color visited link computed value</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
+<link rel="help" href="https://www.w3.org/TR/css3-color/#color0">
+<link rel="help" href="https://www.w3.org/TR/selectors4/#link">
+<meta name="flags" content="may interact">
+<meta name="assert" content="Test checks that computed style of caret-color on visited links doesn't leak privacy information.">
+<script src="../../resources/testharness.js"></script>
+<script src="../../resources/testharnessreport.js"></script>
+<style>
+  a {
+    font-size: 3em;
+    font-weight: bold;
+    width: 10em;
+    padding: 10px;
+    background: black; /* the color of a thin object like the caret is easier to see on a black background. */
+
+    color: white;
+    caret-color: lime;
+  }
+
+  a:link {
+    color: yellow;
+  }
+
+  a:visited {
+    caret-color: cyan;
+  }
+</style>
+<body>
+  <p>Before running this test, the link below must have been visited. It will have yellow text if this is not the case. If it its text is yellow, you need to navigate to this link first.
+  <!-- This is a copy of the W3C test just changing the href on the link, so Blink considers it a visited link. -->
+  <p><a id="link" contenteditable href="">link</a></p>
+  <div id=log></div>
+
+  <script>
+    test(
+      function(){
+        var link = document.getElementById("link");
+        assert_equals(window.getComputedStyle(link)["caret-color"], "rgb(0, 255, 0)");
+    }, "The computed value of a visited link should be the same than a non-visited link");
+  </script>
+</body>
diff --git a/third_party/WebKit/LayoutTests/editing/pasteboard/dragstart-contains-default-content-expected.txt b/third_party/WebKit/LayoutTests/editing/pasteboard/dragstart-contains-default-content-expected.txt
index d7f3e48..2d5d882 100644
--- a/third_party/WebKit/LayoutTests/editing/pasteboard/dragstart-contains-default-content-expected.txt
+++ b/third_party/WebKit/LayoutTests/editing/pasteboard/dragstart-contains-default-content-expected.txt
@@ -9,7 +9,7 @@
 Test ID: selectionTest
 text/plain: Select some text in this box and drag it.
 text/url: 
-text/html: <span style="color: rgb(0, 0, 0); font-family: serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">Select some text in this box and drag it.</span>
+text/html: <span style="color: rgb(0, 0, 0); font-family: serif; font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; caret-color: auto; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">Select some text in this box and drag it.</span>
 Test ID: imageTest
 text/plain: 
 text/url: 
diff --git a/third_party/WebKit/LayoutTests/editing/pasteboard/onpaste-text-html-expected.txt b/third_party/WebKit/LayoutTests/editing/pasteboard/onpaste-text-html-expected.txt
index 1b654e10..7f0e5d1 100644
--- a/third_party/WebKit/LayoutTests/editing/pasteboard/onpaste-text-html-expected.txt
+++ b/third_party/WebKit/LayoutTests/editing/pasteboard/onpaste-text-html-expected.txt
@@ -1,5 +1,5 @@
 CONSOLE MESSAGE: line 21: text/plain: This test verifies that we can get text/html from the clipboard during an onpaste event. 
-CONSOLE MESSAGE: line 23: text/html: <span style="color: rgb(0, 0, 0); font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">This test verifies that we can get text/html from the clipboard during an onpaste event.<span class="Apple-converted-space"> </span></span>
+CONSOLE MESSAGE: line 23: text/html: <span style="color: rgb(0, 0, 0); font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; caret-color: auto; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">This test verifies that we can get text/html from the clipboard during an onpaste event.<span class="Apple-converted-space"> </span></span>
 This test verifies that we can get text/html from the clipboard during an onpaste event. This test requires DRT.
 Paste content in this div.This test verifies that we can get text/html from the clipboard during an onpaste event. 
 PASS
diff --git a/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-listing-expected.txt b/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-listing-expected.txt
index 3e5c9f0..d631396 100644
--- a/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-listing-expected.txt
+++ b/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-listing-expected.txt
@@ -115,6 +115,7 @@
 break-inside: auto
 buffered-rendering: auto
 caption-side: top
+caret-color: auto
 clear: none
 clip: auto
 clip-path: none
diff --git a/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-listing-expected.txt b/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-listing-expected.txt
index 9cb5f43..d80b09e0 100644
--- a/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-listing-expected.txt
+++ b/third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-listing-expected.txt
@@ -115,6 +115,7 @@
 break-inside: auto
 buffered-rendering: auto
 caption-side: top
+caret-color: auto
 clear: none
 clip: auto
 clip-path: none
diff --git a/third_party/WebKit/LayoutTests/fast/events/ondrop-text-html-expected.txt b/third_party/WebKit/LayoutTests/fast/events/ondrop-text-html-expected.txt
index 0ca4aebd..6cc258b 100644
--- a/third_party/WebKit/LayoutTests/fast/events/ondrop-text-html-expected.txt
+++ b/third_party/WebKit/LayoutTests/fast/events/ondrop-text-html-expected.txt
@@ -1,4 +1,4 @@
 CONSOLE MESSAGE: line 21: text/plain: This test verifies that we can get text/html from the drag object during an ondrop event. 
-CONSOLE MESSAGE: line 23: text/html: <span style="color: rgb(0, 0, 0); font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">This test verifies that we can get text/html from the drag object during an ondrop event.<span class="Apple-converted-space"> </span></span>
+CONSOLE MESSAGE: line 23: text/html: <span style="color: rgb(0, 0, 0); font-size: medium; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; caret-color: auto; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">This test verifies that we can get text/html from the drag object during an ondrop event.<span class="Apple-converted-space"> </span></span>
 This test verifies that we can get text/html from the drag object during an ondrop event. This test requires DRT.
 PASS
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-001-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-001-expected.png
new file mode 100644
index 0000000..8c643adc
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-001-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-001-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-001-expected.txt
new file mode 100644
index 0000000..dce3da6
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-001-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x215
+  LayoutBlockFlow {HTML} at (0,0) size 800x215
+    LayoutBlockFlow {BODY} at (8,16) size 784x191
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 561x19
+          text run at (0,0) width 561: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,72) size 784x119
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,88) size 412x114 clip at (9,89) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-002-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-002-expected.png
new file mode 100644
index 0000000..8c643adc
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-002-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-002-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-002-expected.txt
new file mode 100644
index 0000000..12bea4c6
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-002-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x215
+  LayoutBlockFlow {HTML} at (0,0) size 800x215
+    LayoutBlockFlow {BODY} at (8,16) size 784x191
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 561x19
+          text run at (0,0) width 561: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,72) size 784x119
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,88) size 412x114 clip at (9,89) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-003-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-003-expected.png
new file mode 100644
index 0000000..a6aa0d1
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-003-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-003-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-003-expected.txt
new file mode 100644
index 0000000..06f123b
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-003-expected.txt
@@ -0,0 +1,18 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x215
+  LayoutBlockFlow {HTML} at (0,0) size 800x215
+    LayoutBlockFlow {BODY} at (8,16) size 784x191
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 730x19
+          text run at (0,0) width 565: "Test passes if, when the text area below is focused for editing, the text insertion caret is green, "
+          text run at (564,0) width 166: "like the text in that textarea."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,72) size 784x119
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,88) size 412x114 clip at (9,89) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-004-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-004-expected.png
new file mode 100644
index 0000000..a37a9b9
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-004-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-004-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-004-expected.txt
new file mode 100644
index 0000000..79b31495d
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-004-expected.txt
@@ -0,0 +1,19 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x235
+  LayoutBlockFlow {HTML} at (0,0) size 800x235
+    LayoutBlockFlow {BODY} at (8,16) size 784x211
+      LayoutBlockFlow {P} at (0,0) size 784x40
+        LayoutText {#text} at (0,0) size 743x39
+          text run at (0,0) width 598: "Test passes if, when the text area below is focused for editing, the text insertion caret is either black "
+          text run at (597,0) width 146: "or some other color that"
+          text run at (0,20) width 213: "contrasts well with the background."
+      LayoutBlockFlow {P} at (0,56) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,92) size 784x119
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,108) size 412x114 clip at (9,109) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [bgcolor=#FFFFFF] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-005-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-005-expected.png
new file mode 100644
index 0000000..94c96762
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-005-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-005-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-005-expected.txt
new file mode 100644
index 0000000..e4e4aaad
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-005-expected.txt
@@ -0,0 +1,19 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x235
+  LayoutBlockFlow {HTML} at (0,0) size 800x235
+    LayoutBlockFlow {BODY} at (8,16) size 784x211
+      LayoutBlockFlow {P} at (0,0) size 784x40
+        LayoutText {#text} at (0,0) size 742x39
+          text run at (0,0) width 597: "Test passes if, when the text area below is focused for editing, the text insertion caret is either white "
+          text run at (596,0) width 146: "or some other color that"
+          text run at (0,20) width 213: "contrasts well with the background."
+      LayoutBlockFlow {P} at (0,56) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,92) size 784x119
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,108) size 412x114 clip at (9,109) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-007-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-007-expected.png
new file mode 100644
index 0000000..5c49ad0
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-007-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-007-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-007-expected.txt
new file mode 100644
index 0000000..cce14d6
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-007-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x215
+  LayoutBlockFlow {HTML} at (0,0) size 800x215
+    LayoutBlockFlow {BODY} at (8,16) size 784x191
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 557x19
+          text run at (0,0) width 557: "Test passes if, when the text area below is focused for editing, the text insertion caret is green"
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,72) size 784x119 [color=#FF0000]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,88) size 412x114 clip at (9,89) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-010-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-010-expected.png
new file mode 100644
index 0000000..bd02f19
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-010-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-010-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-010-expected.txt
new file mode 100644
index 0000000..2a1d3a3
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-010-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x178
+  LayoutBlockFlow {HTML} at (0,0) size 800x178
+    LayoutBlockFlow {BODY} at (8,16) size 784x154
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 567x19
+          text run at (0,0) width 567: "Test passes if, when the input field below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,72) size 784x82
+        LayoutTextControl {INPUT} at (0,0) size 504x82 [color=#FFFFFF] [bgcolor=#000000] [border: (2px inset #EEEEEE)]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (20,100) size 480x58
+  LayoutBlockFlow {DIV} at (12,12) size 480x58
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {INPUT} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-011-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-011-expected.png
new file mode 100644
index 0000000..1cb7256
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-011-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-011-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-011-expected.txt
new file mode 100644
index 0000000..74a959e
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-011-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x230
+  LayoutBlockFlow {HTML} at (0,0) size 800x230
+    LayoutBlockFlow {BODY} at (8,16) size 784x206
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 706x19
+          text run at (0,0) width 706: "Test passes if, when when the editable element below is focused is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,72) size 500x134 [color=#FFFFFF] [bgcolor=#000000]
+        LayoutText {#text} at (10,11) size 391x112
+          text run at (10,11) width 379: "Focus this editable"
+          text run at (389,11) width 12: " "
+          text run at (10,68) width 159: "element"
+caret: position 0 of child 0 {#text} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-012-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-012-expected.png
new file mode 100644
index 0000000..8c643adc
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-012-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-012-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-012-expected.txt
new file mode 100644
index 0000000..a7ce004
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-012-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x215
+  LayoutBlockFlow {HTML} at (0,0) size 800x215
+    LayoutBlockFlow {BODY} at (8,16) size 784x191
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 561x19
+          text run at (0,0) width 561: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,72) size 784x119 [color=#FF0000]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,88) size 412x114 clip at (9,89) size 410x112
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x114 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x46
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-014-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-014-expected.png
new file mode 100644
index 0000000..46ef8f20
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-014-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-014-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-014-expected.txt
new file mode 100644
index 0000000..9354b2e
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-014-expected.txt
@@ -0,0 +1,18 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x153
+  LayoutBlockFlow {HTML} at (0,0) size 800x153
+    LayoutBlockFlow {BODY} at (8,16) size 784x129
+      LayoutBlockFlow {P} at (0,0) size 784x20
+        LayoutText {#text} at (0,0) size 489x19
+          text run at (0,0) width 489: "Test passes if, when the link is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,36) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,72) size 784x57
+        LayoutInline {A} at (0,0) size 99x75 [color=#FFFFFF] [bgcolor=#000000]
+          LayoutText {#text} at (10,1) size 79x55
+            text run at (10,1) width 79: "link"
+        LayoutText {#text} at (0,0) size 0x0
+        LayoutText {#text} at (0,0) size 0x0
+caret: position 0 of child 0 {#text} of child 5 {A} of body
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-015-expected.png b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-015-expected.png
new file mode 100644
index 0000000..0263676f
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-015-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-015-expected.txt b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-015-expected.txt
new file mode 100644
index 0000000..7a47e91
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/linux/editing/caret/caret-color-015-expected.txt
@@ -0,0 +1,22 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x209
+  LayoutBlockFlow {HTML} at (0,0) size 800x209
+    LayoutBlockFlow {BODY} at (8,16) size 784x185
+      LayoutBlockFlow {P} at (0,0) size 784x40
+        LayoutText {#text} at (0,0) size 764x39
+          text run at (0,0) width 764: "Before running this test, the link below must have been visited. It will have yellow text if this is not the case. If it its text is yellow,"
+          text run at (0,20) width 219: "you need to navigate to this link first."
+      LayoutBlockFlow {P} at (0,56) size 784x20
+        LayoutText {#text} at (0,0) size 530x19
+          text run at (0,0) width 530: "Test passes if, when the link below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,92) size 784x20
+        LayoutText {#text} at (0,0) size 416x19
+          text run at (0,0) width 416: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,128) size 784x57
+        LayoutInline {A} at (0,0) size 99x75 [color=#FFFFFF] [bgcolor=#000000]
+          LayoutText {#text} at (10,1) size 79x55
+            text run at (10,1) width 79: "link"
+        LayoutText {#text} at (0,0) size 0x0
+        LayoutText {#text} at (0,0) size 0x0
+caret: position 0 of child 0 {#text} of child 8 {A} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-001-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-001-expected.png
new file mode 100644
index 0000000..e1e9341
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-001-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-001-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-001-expected.txt
new file mode 100644
index 0000000..70a1a96
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-001-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x230
+  LayoutBlockFlow {HTML} at (0,0) size 800x230
+    LayoutBlockFlow {BODY} at (8,16) size 784x206
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 602x18
+          text run at (0,0) width 602: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x138
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 502x134 clip at (9,85) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #FFFFFF)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-002-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-002-expected.png
new file mode 100644
index 0000000..e1e9341
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-002-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-002-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-002-expected.txt
new file mode 100644
index 0000000..7d8d428
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-002-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x230
+  LayoutBlockFlow {HTML} at (0,0) size 800x230
+    LayoutBlockFlow {BODY} at (8,16) size 784x206
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 602x18
+          text run at (0,0) width 602: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 784x138
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 502x134 clip at (9,85) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #FFFFFF)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-003-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-003-expected.png
new file mode 100644
index 0000000..b2fb271
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-003-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-003-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-003-expected.txt
new file mode 100644
index 0000000..627b69d
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-003-expected.txt
@@ -0,0 +1,18 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x230
+  LayoutBlockFlow {HTML} at (0,0) size 800x230
+    LayoutBlockFlow {BODY} at (8,16) size 784x206
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 784x18
+          text run at (0,0) width 606: "Test passes if, when the text area below is focused for editing, the text insertion caret is green, "
+          text run at (605,0) width 179: "like the text in that textarea."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x138
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 502x134 clip at (9,85) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #00FF00)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-004-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-004-expected.png
new file mode 100644
index 0000000..6485691
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-004-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-004-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-004-expected.txt
new file mode 100644
index 0000000..e044a506
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-004-expected.txt
@@ -0,0 +1,19 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x248
+  LayoutBlockFlow {HTML} at (0,0) size 800x248
+    LayoutBlockFlow {BODY} at (8,16) size 784x224
+      LayoutBlockFlow {P} at (0,0) size 784x36
+        LayoutText {#text} at (0,0) size 766x36
+          text run at (0,0) width 641: "Test passes if, when the text area below is focused for editing, the text insertion caret is either black "
+          text run at (640,0) width 126: "or some other color"
+          text run at (0,18) width 256: "that contrasts well with the background."
+      LayoutBlockFlow {P} at (0,52) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,86) size 784x138
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,102) size 502x134 clip at (9,103) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [bgcolor=#FFFFFF] [border: (1px solid #000000)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-005-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-005-expected.png
new file mode 100644
index 0000000..2211d8f
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-005-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-005-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-005-expected.txt
new file mode 100644
index 0000000..7532d70c
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-005-expected.txt
@@ -0,0 +1,19 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x248
+  LayoutBlockFlow {HTML} at (0,0) size 800x248
+    LayoutBlockFlow {BODY} at (8,16) size 784x224
+      LayoutBlockFlow {P} at (0,0) size 784x36
+        LayoutText {#text} at (0,0) size 767x36
+          text run at (0,0) width 642: "Test passes if, when the text area below is focused for editing, the text insertion caret is either white "
+          text run at (641,0) width 126: "or some other color"
+          text run at (0,18) width 256: "that contrasts well with the background."
+      LayoutBlockFlow {P} at (0,52) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,86) size 784x138
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,102) size 502x134 clip at (9,103) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #FFFFFF)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-007-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-007-expected.png
new file mode 100644
index 0000000..ea4f9723
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-007-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-007-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-007-expected.txt
new file mode 100644
index 0000000..5a2afa8
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-007-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x230
+  LayoutBlockFlow {HTML} at (0,0) size 800x230
+    LayoutBlockFlow {BODY} at (8,16) size 784x206
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 598x18
+          text run at (0,0) width 598: "Test passes if, when the text area below is focused for editing, the text insertion caret is green"
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 784x138 [color=#FF0000]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 502x134 clip at (9,85) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #00FF00)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-010-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-010-expected.png
new file mode 100644
index 0000000..228f2fc4
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-010-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-010-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-010-expected.txt
new file mode 100644
index 0000000..6c7b1af
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-010-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x172
+  LayoutBlockFlow {HTML} at (0,0) size 800x172
+    LayoutBlockFlow {BODY} at (8,16) size 784x148
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 613x18
+          text run at (0,0) width 613: "Test passes if, when the input field below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x80
+        LayoutTextControl {INPUT} at (0,0) size 504x80 [color=#FFFFFF] [bgcolor=#000000] [border: (2px inset #EEEEEE)]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (20,96) size 480x56
+  LayoutBlockFlow {DIV} at (12,12) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {INPUT} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-011-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-011-expected.png
new file mode 100644
index 0000000..79a34c9b
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-011-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-011-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-011-expected.txt
new file mode 100644
index 0000000..3f68f05
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-011-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x222
+  LayoutBlockFlow {HTML} at (0,0) size 800x222
+    LayoutBlockFlow {BODY} at (8,16) size 784x198
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 760x18
+          text run at (0,0) width 760: "Test passes if, when when the editable element below is focused is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 500x130 [color=#FFFFFF] [bgcolor=#000000]
+        LayoutText {#text} at (10,10) size 394x110
+          text run at (10,10) width 382: "Focus this editable"
+          text run at (391,10) width 13: " "
+          text run at (10,65) width 160: "element"
+caret: position 0 of child 0 {#text} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-012-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-012-expected.png
new file mode 100644
index 0000000..e1e9341
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-012-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-012-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-012-expected.txt
new file mode 100644
index 0000000..467c153
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-012-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x230
+  LayoutBlockFlow {HTML} at (0,0) size 800x230
+    LayoutBlockFlow {BODY} at (8,16) size 784x206
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 602x18
+          text run at (0,0) width 602: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 784x138 [color=#FF0000]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 502x134 clip at (9,85) size 500x132
+  LayoutTextControl {TEXTAREA} at (0,0) size 502x134 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #00FF00)]
+    LayoutBlockFlow {DIV} at (11,11) size 480x56
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-014-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-014-expected.png
new file mode 100644
index 0000000..05c1659
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-014-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-014-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-014-expected.txt
new file mode 100644
index 0000000..1f50612
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-014-expected.txt
@@ -0,0 +1,18 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x147
+  LayoutBlockFlow {HTML} at (0,0) size 800x147
+    LayoutBlockFlow {BODY} at (8,16) size 784x123
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 529x18
+          text run at (0,0) width 529: "Test passes if, when the link is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x55
+        LayoutInline {A} at (0,0) size 101x75 [color=#FFFFFF] [bgcolor=#000000]
+          LayoutText {#text} at (10,0) size 81x55
+            text run at (10,0) width 81: "link"
+        LayoutText {#text} at (0,0) size 0x0
+        LayoutText {#text} at (0,0) size 0x0
+caret: position 0 of child 0 {#text} of child 5 {A} of body
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-015-expected.png b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-015-expected.png
new file mode 100644
index 0000000..4b66ebb4
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-015-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-015-expected.txt b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-015-expected.txt
new file mode 100644
index 0000000..41e86c99
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/mac/editing/caret/caret-color-015-expected.txt
@@ -0,0 +1,22 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x199
+  LayoutBlockFlow {HTML} at (0,0) size 800x199
+    LayoutBlockFlow {BODY} at (8,16) size 784x175
+      LayoutBlockFlow {P} at (0,0) size 784x36
+        LayoutText {#text} at (0,0) size 771x36
+          text run at (0,0) width 771: "Before running this test, the link below must have been visited. It will have yellow text if this is not the case. If it its text"
+          text run at (0,18) width 304: "is yellow, you need to navigate to this link first."
+      LayoutBlockFlow {P} at (0,52) size 784x18
+        LayoutText {#text} at (0,0) size 572x18
+          text run at (0,0) width 572: "Test passes if, when the link below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,86) size 784x18
+        LayoutText {#text} at (0,0) size 441x18
+          text run at (0,0) width 441: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,120) size 784x55
+        LayoutInline {A} at (0,0) size 101x75 [color=#FFFFFF] [bgcolor=#000000]
+          LayoutText {#text} at (10,0) size 81x55
+            text run at (10,0) width 81: "link"
+        LayoutText {#text} at (0,0) size 0x0
+        LayoutText {#text} at (0,0) size 0x0
+caret: position 0 of child 0 {#text} of child 8 {A} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-001-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-001-expected.png
new file mode 100644
index 0000000..385af66c
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-001-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-001-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-001-expected.txt
new file mode 100644
index 0000000..a4a54e5
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-001-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x206
+  LayoutBlockFlow {HTML} at (0,0) size 800x206
+    LayoutBlockFlow {BODY} at (8,16) size 784x182
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 602x17
+          text run at (0,0) width 602: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x114
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 412x110 clip at (9,85) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-002-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-002-expected.png
new file mode 100644
index 0000000..385af66c
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-002-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-002-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-002-expected.txt
new file mode 100644
index 0000000..55b2c2a
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-002-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x206
+  LayoutBlockFlow {HTML} at (0,0) size 800x206
+    LayoutBlockFlow {BODY} at (8,16) size 784x182
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 602x17
+          text run at (0,0) width 602: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 784x114
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 412x110 clip at (9,85) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-003-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-003-expected.png
new file mode 100644
index 0000000..e667ac17
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-003-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-003-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-003-expected.txt
new file mode 100644
index 0000000..da917d2
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-003-expected.txt
@@ -0,0 +1,18 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x206
+  LayoutBlockFlow {HTML} at (0,0) size 800x206
+    LayoutBlockFlow {BODY} at (8,16) size 784x182
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 784x17
+          text run at (0,0) width 606: "Test passes if, when the text area below is focused for editing, the text insertion caret is green, "
+          text run at (605,0) width 179: "like the text in that textarea."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x114
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 412x110 clip at (9,85) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-004-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-004-expected.png
new file mode 100644
index 0000000..4f06cb1
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-004-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-004-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-004-expected.txt
new file mode 100644
index 0000000..3b580ce
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-004-expected.txt
@@ -0,0 +1,19 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x224
+  LayoutBlockFlow {HTML} at (0,0) size 800x224
+    LayoutBlockFlow {BODY} at (8,16) size 784x200
+      LayoutBlockFlow {P} at (0,0) size 784x36
+        LayoutText {#text} at (0,0) size 766x35
+          text run at (0,0) width 641: "Test passes if, when the text area below is focused for editing, the text insertion caret is either black "
+          text run at (640,0) width 126: "or some other color"
+          text run at (0,18) width 256: "that contrasts well with the background."
+      LayoutBlockFlow {P} at (0,52) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,86) size 784x114
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,102) size 412x110 clip at (9,103) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [bgcolor=#FFFFFF] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-005-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-005-expected.png
new file mode 100644
index 0000000..2ec74eed
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-005-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-005-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-005-expected.txt
new file mode 100644
index 0000000..136a886
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-005-expected.txt
@@ -0,0 +1,19 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x224
+  LayoutBlockFlow {HTML} at (0,0) size 800x224
+    LayoutBlockFlow {BODY} at (8,16) size 784x200
+      LayoutBlockFlow {P} at (0,0) size 784x36
+        LayoutText {#text} at (0,0) size 767x35
+          text run at (0,0) width 642: "Test passes if, when the text area below is focused for editing, the text insertion caret is either white "
+          text run at (641,0) width 126: "or some other color"
+          text run at (0,18) width 256: "that contrasts well with the background."
+      LayoutBlockFlow {P} at (0,52) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,86) size 784x114
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,102) size 412x110 clip at (9,103) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [color=#FFFFFF] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {TEXTAREA} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-007-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-007-expected.png
new file mode 100644
index 0000000..48308ad
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-007-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-007-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-007-expected.txt
new file mode 100644
index 0000000..619fad9
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-007-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x206
+  LayoutBlockFlow {HTML} at (0,0) size 800x206
+    LayoutBlockFlow {BODY} at (8,16) size 784x182
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 598x17
+          text run at (0,0) width 598: "Test passes if, when the text area below is focused for editing, the text insertion caret is green"
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 784x114 [color=#FF0000]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 412x110 clip at (9,85) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-010-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-010-expected.png
new file mode 100644
index 0000000..f318706
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-010-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-010-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-010-expected.txt
new file mode 100644
index 0000000..f1797c9e
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-010-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x171
+  LayoutBlockFlow {HTML} at (0,0) size 800x171
+    LayoutBlockFlow {BODY} at (8,16) size 784x147
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 613x17
+          text run at (0,0) width 613: "Test passes if, when the input field below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x79
+        LayoutTextControl {INPUT} at (0,0) size 504x79 [color=#FFFFFF] [bgcolor=#000000] [border: (2px inset #EEEEEE)]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (20,96) size 480x55
+  LayoutBlockFlow {DIV} at (12,12) size 480x55
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 5 {INPUT} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-011-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-011-expected.png
new file mode 100644
index 0000000..3b1489d
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-011-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-011-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-011-expected.txt
new file mode 100644
index 0000000..efd17cf
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-011-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x222
+  LayoutBlockFlow {HTML} at (0,0) size 800x222
+    LayoutBlockFlow {BODY} at (8,16) size 784x198
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 760x17
+          text run at (0,0) width 760: "Test passes if, when when the editable element below is focused is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 500x130 [color=#FFFFFF] [bgcolor=#000000]
+        LayoutText {#text} at (10,11) size 394x108
+          text run at (10,11) width 382: "Focus this editable"
+          text run at (391,11) width 13: " "
+          text run at (10,66) width 160: "element"
+caret: position 0 of child 0 {#text} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-012-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-012-expected.png
new file mode 100644
index 0000000..385af66c
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-012-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-012-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-012-expected.txt
new file mode 100644
index 0000000..f31857a6
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-012-expected.txt
@@ -0,0 +1,17 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x206
+  LayoutBlockFlow {HTML} at (0,0) size 800x206
+    LayoutBlockFlow {BODY} at (8,16) size 784x182
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 602x17
+          text run at (0,0) width 602: "Test passes if, when the text area below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow {DIV} at (0,68) size 784x114 [color=#FF0000]
+        LayoutText {#text} at (0,0) size 0x0
+layer at (8,84) size 412x110 clip at (9,85) size 410x108
+  LayoutTextControl {TEXTAREA} at (0,0) size 412x110 [color=#00FF00] [bgcolor=#000000] [border: (1px solid #A9A9A9)]
+    LayoutBlockFlow {DIV} at (11,11) size 390x44
+caret: position 0 of child 0 {DIV} of {#document-fragment} of child 1 {TEXTAREA} of child 5 {DIV} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-014-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-014-expected.png
new file mode 100644
index 0000000..213f512
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-014-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-014-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-014-expected.txt
new file mode 100644
index 0000000..440436d
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-014-expected.txt
@@ -0,0 +1,18 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x147
+  LayoutBlockFlow {HTML} at (0,0) size 800x147
+    LayoutBlockFlow {BODY} at (8,16) size 784x123
+      LayoutBlockFlow {P} at (0,0) size 784x18
+        LayoutText {#text} at (0,0) size 529x17
+          text run at (0,0) width 529: "Test passes if, when the link is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,34) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,68) size 784x55
+        LayoutInline {A} at (0,0) size 101x73 [color=#FFFFFF] [bgcolor=#000000]
+          LayoutText {#text} at (10,1) size 81x53
+            text run at (10,1) width 81: "link"
+        LayoutText {#text} at (0,0) size 0x0
+        LayoutText {#text} at (0,0) size 0x0
+caret: position 0 of child 0 {#text} of child 5 {A} of body
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-015-expected.png b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-015-expected.png
new file mode 100644
index 0000000..a94fe3b0
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-015-expected.png
Binary files differ
diff --git a/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-015-expected.txt b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-015-expected.txt
new file mode 100644
index 0000000..b8199df
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/platform/win/editing/caret/caret-color-015-expected.txt
@@ -0,0 +1,22 @@
+layer at (0,0) size 800x600
+  LayoutView at (0,0) size 800x600
+layer at (0,0) size 800x199
+  LayoutBlockFlow {HTML} at (0,0) size 800x199
+    LayoutBlockFlow {BODY} at (8,16) size 784x175
+      LayoutBlockFlow {P} at (0,0) size 784x36
+        LayoutText {#text} at (0,0) size 771x35
+          text run at (0,0) width 771: "Before running this test, the link below must have been visited. It will have yellow text if this is not the case. If it its text"
+          text run at (0,18) width 305: "is yellow, you need to navigate to this link first."
+      LayoutBlockFlow {P} at (0,52) size 784x18
+        LayoutText {#text} at (0,0) size 572x17
+          text run at (0,0) width 572: "Test passes if, when the link below is focused for editing, the text insertion caret is green."
+      LayoutBlockFlow {P} at (0,86) size 784x18
+        LayoutText {#text} at (0,0) size 442x17
+          text run at (0,0) width 442: "The shape of the caret, and whether it flashes, are not part of the test."
+      LayoutBlockFlow (anonymous) at (0,120) size 784x55
+        LayoutInline {A} at (0,0) size 101x73 [color=#FFFFFF] [bgcolor=#000000]
+          LayoutText {#text} at (10,1) size 81x53
+            text run at (10,1) width 81: "link"
+        LayoutText {#text} at (0,0) size 0x0
+        LayoutText {#text} at (0,0) size 0x0
+caret: position 0 of child 0 {#text} of child 8 {A} of body
diff --git a/third_party/WebKit/LayoutTests/svg/css/getComputedStyle-listing-expected.txt b/third_party/WebKit/LayoutTests/svg/css/getComputedStyle-listing-expected.txt
index 282a005..8199c61 100644
--- a/third_party/WebKit/LayoutTests/svg/css/getComputedStyle-listing-expected.txt
+++ b/third_party/WebKit/LayoutTests/svg/css/getComputedStyle-listing-expected.txt
@@ -115,6 +115,7 @@
 break-inside: auto
 buffered-rendering: auto
 caption-side: top
+caret-color: auto
 clear: none
 clip: auto
 clip-path: none
diff --git a/third_party/WebKit/LayoutTests/virtual/stable/webexposed/css-properties-as-js-properties-expected.txt b/third_party/WebKit/LayoutTests/virtual/stable/webexposed/css-properties-as-js-properties-expected.txt
index b0e33713..02c8750 100644
--- a/third_party/WebKit/LayoutTests/virtual/stable/webexposed/css-properties-as-js-properties-expected.txt
+++ b/third_party/WebKit/LayoutTests/virtual/stable/webexposed/css-properties-as-js-properties-expected.txt
@@ -71,6 +71,7 @@
 breakInside
 bufferedRendering
 captionSide
+caretColor
 clear
 clip
 clipPath
diff --git a/third_party/WebKit/LayoutTests/webexposed/css-properties-as-js-properties-expected.txt b/third_party/WebKit/LayoutTests/webexposed/css-properties-as-js-properties-expected.txt
index 9d3657f..d92a4a4 100644
--- a/third_party/WebKit/LayoutTests/webexposed/css-properties-as-js-properties-expected.txt
+++ b/third_party/WebKit/LayoutTests/webexposed/css-properties-as-js-properties-expected.txt
@@ -72,6 +72,7 @@
 breakInside
 bufferedRendering
 captionSide
+caretColor
 clear
 clip
 clipPath
diff --git a/third_party/WebKit/Source/core/css/BUILD.gn b/third_party/WebKit/Source/core/css/BUILD.gn
index adcb057..ae40a90 100644
--- a/third_party/WebKit/Source/core/css/BUILD.gn
+++ b/third_party/WebKit/Source/core/css/BUILD.gn
@@ -221,6 +221,7 @@
     "SelectorChecker.h",
     "SelectorFilter.cpp",
     "SelectorFilter.h",
+    "StyleAutoColor.h",
     "StyleColor.cpp",
     "StyleColor.h",
     "StyleMedia.cpp",
diff --git a/third_party/WebKit/Source/core/css/CSSComputedStyleDeclaration.cpp b/third_party/WebKit/Source/core/css/CSSComputedStyleDeclaration.cpp
index ef323be..58dfc435 100644
--- a/third_party/WebKit/Source/core/css/CSSComputedStyleDeclaration.cpp
+++ b/third_party/WebKit/Source/core/css/CSSComputedStyleDeclaration.cpp
@@ -173,8 +173,7 @@
     CSSPropertyRy, CSSPropertyScrollSnapType, CSSPropertyScrollSnapPointsX,
     CSSPropertyScrollSnapPointsY, CSSPropertyScrollSnapCoordinate,
     CSSPropertyScrollSnapDestination, CSSPropertyTranslate, CSSPropertyRotate,
-    CSSPropertyScale,
-};
+    CSSPropertyScale, CSSPropertyCaretColor};
 
 static const Vector<CSSPropertyID>& computableProperties() {
   DEFINE_STATIC_LOCAL(Vector<CSSPropertyID>, properties, ());
diff --git a/third_party/WebKit/Source/core/css/CSSProperties.in b/third_party/WebKit/Source/core/css/CSSProperties.in
index 7032c3ef..6c1aeb6 100644
--- a/third_party/WebKit/Source/core/css/CSSProperties.in
+++ b/third_party/WebKit/Source/core/css/CSSProperties.in
@@ -203,6 +203,7 @@
 break-inside type_name=EBreak
 buffered-rendering svg
 caption-side inherited, keyword_only, keywords=[top|bottom|left|right]
+caret-color inherited, custom_all
 clear
 clip interpolable, converter=convertClip, custom_all
 clip-path interpolable, converter=convertClipPath
diff --git a/third_party/WebKit/Source/core/css/CSSPropertyEquality.cpp b/third_party/WebKit/Source/core/css/CSSPropertyEquality.cpp
index 1ab54cd0..be8e6f2 100644
--- a/third_party/WebKit/Source/core/css/CSSPropertyEquality.cpp
+++ b/third_party/WebKit/Source/core/css/CSSPropertyEquality.cpp
@@ -116,6 +116,9 @@
       return a.bottom() == b.bottom();
     case CSSPropertyBoxShadow:
       return dataEquivalent(a.boxShadow(), b.boxShadow());
+    case CSSPropertyCaretColor:
+      return a.caretColor() == b.caretColor() &&
+             a.visitedLinkCaretColor() == b.visitedLinkCaretColor();
     case CSSPropertyClip:
       return a.clip() == b.clip();
     case CSSPropertyColor:
diff --git a/third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp b/third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp
index 0237d9f..3a4c9c1 100644
--- a/third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp
+++ b/third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp
@@ -2205,6 +2205,12 @@
       return valueForShadowList(style.boxShadow(), style, true);
     case CSSPropertyCaptionSide:
       return CSSIdentifierValue::create(style.captionSide());
+    case CSSPropertyCaretColor:
+      if (style.caretColor().isCurrentColor())
+        return CSSIdentifierValue::create(CSSValueCurrentcolor);
+      if (style.caretColor().isAutoColor())
+        return CSSIdentifierValue::create(CSSValueAuto);
+      return CSSColorValue::create(style.caretColor().color().rgb());
     case CSSPropertyClear:
       return CSSIdentifierValue::create(style.clear());
     case CSSPropertyColor:
diff --git a/third_party/WebKit/Source/core/css/StyleAutoColor.h b/third_party/WebKit/Source/core/css/StyleAutoColor.h
new file mode 100644
index 0000000..c3bb6ea76
--- /dev/null
+++ b/third_party/WebKit/Source/core/css/StyleAutoColor.h
@@ -0,0 +1,64 @@
+// Copyright 2016 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+#ifndef StyleAutoColor_h
+#define StyleAutoColor_h
+
+#include "core/css/StyleColor.h"
+#include "platform/graphics/Color.h"
+#include "wtf/Allocator.h"
+
+namespace blink {
+
+class StyleAutoColor {
+  DISALLOW_NEW();
+
+ public:
+  StyleAutoColor(Color color)
+      : m_type(ValueType::SpecifiedColor), m_color(color) {}
+  static StyleAutoColor autoColor() { return StyleAutoColor(ValueType::Auto); }
+  static StyleAutoColor currentColor() {
+    return StyleAutoColor(ValueType::CurrentColor);
+  }
+
+  bool isAutoColor() const { return m_type == ValueType::Auto; }
+  bool isCurrentColor() const { return m_type == ValueType::CurrentColor; }
+  Color color() const {
+    DCHECK(m_type == ValueType::SpecifiedColor);
+    return m_color;
+  }
+
+  Color resolve(Color currentColor) const {
+    return m_type == ValueType::SpecifiedColor ? m_color : currentColor;
+  }
+
+  StyleColor toStyleColor() const {
+    if (m_type == ValueType::SpecifiedColor)
+      return StyleColor(m_color);
+    return StyleColor::currentColor();
+  }
+
+ private:
+  enum class ValueType { Auto, CurrentColor, SpecifiedColor };
+  StyleAutoColor(ValueType type) : m_type(type) {}
+
+  ValueType m_type;
+  Color m_color;
+};
+
+inline bool operator==(const StyleAutoColor& a, const StyleAutoColor& b) {
+  if (a.isAutoColor() || b.isAutoColor())
+    return a.isAutoColor() && b.isAutoColor();
+  if (a.isCurrentColor() || b.isCurrentColor())
+    return a.isCurrentColor() && b.isCurrentColor();
+  return a.color() == b.color();
+}
+
+inline bool operator!=(const StyleAutoColor& a, const StyleAutoColor& b) {
+  return !(a == b);
+}
+
+}  // namespace blink
+
+#endif  // StyleAutoColor_h
diff --git a/third_party/WebKit/Source/core/css/parser/CSSParserFastPaths.cpp b/third_party/WebKit/Source/core/css/parser/CSSParserFastPaths.cpp
index ff06e31..b605508 100644
--- a/third_party/WebKit/Source/core/css/parser/CSSParserFastPaths.cpp
+++ b/third_party/WebKit/Source/core/css/parser/CSSParserFastPaths.cpp
@@ -138,6 +138,7 @@
 
 static inline bool isColorPropertyID(CSSPropertyID propertyId) {
   switch (propertyId) {
+    case CSSPropertyCaretColor:
     case CSSPropertyColor:
     case CSSPropertyBackgroundColor:
     case CSSPropertyBorderBottomColor:
diff --git a/third_party/WebKit/Source/core/css/parser/CSSPropertyParser.cpp b/third_party/WebKit/Source/core/css/parser/CSSPropertyParser.cpp
index 1b7bfb4..39ac942 100644
--- a/third_party/WebKit/Source/core/css/parser/CSSPropertyParser.cpp
+++ b/third_party/WebKit/Source/core/css/parser/CSSPropertyParser.cpp
@@ -3597,6 +3597,10 @@
     case CSSPropertyColor:
     case CSSPropertyBackgroundColor:
       return consumeColor(m_range, m_context.mode(), inQuirksMode());
+    case CSSPropertyCaretColor:
+      if (m_range.peek().id() == CSSValueAuto)
+        return consumeIdent(m_range);
+      return consumeColor(m_range, m_context.mode());
     case CSSPropertyWebkitBorderStartWidth:
     case CSSPropertyWebkitBorderEndWidth:
     case CSSPropertyWebkitBorderBeforeWidth:
diff --git a/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.cpp b/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.cpp
index 5093c1b..6da6660 100644
--- a/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.cpp
+++ b/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.cpp
@@ -1110,6 +1110,20 @@
                                                              forVisitedLink);
 }
 
+StyleAutoColor StyleBuilderConverter::convertStyleAutoColor(
+    StyleResolverState& state,
+    const CSSValue& value,
+    bool forVisitedLink) {
+  if (value.isIdentifierValue()) {
+    if (toCSSIdentifierValue(value).getValueID() == CSSValueCurrentcolor)
+      return StyleAutoColor::currentColor();
+    if (toCSSIdentifierValue(value).getValueID() == CSSValueAuto)
+      return StyleAutoColor::autoColor();
+  }
+  return state.document().textLinkColors().colorFromCSSValue(value, Color(),
+                                                             forVisitedLink);
+}
+
 float StyleBuilderConverter::convertTextStrokeWidth(StyleResolverState& state,
                                                     const CSSValue& value) {
   if (value.isIdentifierValue() && toCSSIdentifierValue(value).getValueID()) {
diff --git a/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.h b/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.h
index 6acba783..2d92d1f 100644
--- a/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.h
+++ b/third_party/WebKit/Source/core/css/resolver/StyleBuilderConverter.h
@@ -137,6 +137,9 @@
   static StyleColor convertStyleColor(StyleResolverState&,
                                       const CSSValue&,
                                       bool forVisitedLink = false);
+  static StyleAutoColor convertStyleAutoColor(StyleResolverState&,
+                                              const CSSValue&,
+                                              bool forVisitedLink = false);
   static float convertTextStrokeWidth(StyleResolverState&, const CSSValue&);
   static TextSizeAdjust convertTextSizeAdjust(StyleResolverState&,
                                               const CSSValue&);
diff --git a/third_party/WebKit/Source/core/css/resolver/StyleBuilderCustom.cpp b/third_party/WebKit/Source/core/css/resolver/StyleBuilderCustom.cpp
index a32acd7..c9739d5 100644
--- a/third_party/WebKit/Source/core/css/resolver/StyleBuilderCustom.cpp
+++ b/third_party/WebKit/Source/core/css/resolver/StyleBuilderCustom.cpp
@@ -92,6 +92,7 @@
     case CSSPropertyBorderRightColor:
     case CSSPropertyBorderTopColor:
     case CSSPropertyBorderBottomColor:
+    case CSSPropertyCaretColor:
     case CSSPropertyColor:
     case CSSPropertyFill:
     case CSSPropertyOutlineColor:
@@ -1041,4 +1042,35 @@
     state.style()->setPosition(state.parentStyle()->position());
 }
 
+void StyleBuilderFunctions::applyInitialCSSPropertyCaretColor(
+    StyleResolverState& state) {
+  StyleAutoColor color = StyleAutoColor::autoColor();
+  if (state.applyPropertyToRegularStyle())
+    state.style()->setCaretColor(color);
+  if (state.applyPropertyToVisitedLinkStyle())
+    state.style()->setVisitedLinkCaretColor(color);
+}
+
+void StyleBuilderFunctions::applyInheritCSSPropertyCaretColor(
+    StyleResolverState& state) {
+  StyleAutoColor color = state.parentStyle()->caretColor();
+  if (state.applyPropertyToRegularStyle())
+    state.style()->setCaretColor(color);
+  if (state.applyPropertyToVisitedLinkStyle())
+    state.style()->setVisitedLinkCaretColor(color);
+}
+
+void StyleBuilderFunctions::applyValueCSSPropertyCaretColor(
+    StyleResolverState& state,
+    const CSSValue& value) {
+  if (state.applyPropertyToRegularStyle()) {
+    state.style()->setCaretColor(
+        StyleBuilderConverter::convertStyleAutoColor(state, value));
+  }
+  if (state.applyPropertyToVisitedLinkStyle()) {
+    state.style()->setVisitedLinkCaretColor(
+        StyleBuilderConverter::convertStyleAutoColor(state, value, true));
+  }
+}
+
 }  // namespace blink
diff --git a/third_party/WebKit/Source/core/editing/CaretBase.cpp b/third_party/WebKit/Source/core/editing/CaretBase.cpp
index 5c3a08f6..07e9ed7 100644
--- a/third_party/WebKit/Source/core/editing/CaretBase.cpp
+++ b/third_party/WebKit/Source/core/editing/CaretBase.cpp
@@ -187,7 +187,8 @@
     layoutObject->flipForWritingMode(drawingRect);
   drawingRect.moveBy(paintOffset);
 
-  const Color caretColor = node->layoutObject()->resolveColor(CSSPropertyColor);
+  const Color caretColor =
+      node->layoutObject()->resolveColor(CSSPropertyCaretColor);
   IntRect paintRect = pixelSnappedIntRect(drawingRect);
   DrawingRecorder drawingRecorder(context, *this, DisplayItem::kCaret,
                                   paintRect);
diff --git a/third_party/WebKit/Source/core/editing/EditingStyle.cpp b/third_party/WebKit/Source/core/editing/EditingStyle.cpp
index 6bbf51c..0b43cbf 100644
--- a/third_party/WebKit/Source/core/editing/EditingStyle.cpp
+++ b/third_party/WebKit/Source/core/editing/EditingStyle.cpp
@@ -89,7 +89,7 @@
     CSSPropertyWidows, CSSPropertyWordSpacing,
     CSSPropertyWebkitTextDecorationsInEffect, CSSPropertyWebkitTextFillColor,
     CSSPropertyWebkitTextStrokeColor, CSSPropertyWebkitTextStrokeWidth,
-};
+    CSSPropertyCaretColor};
 
 enum EditingPropertiesType {
   OnlyInheritableEditingProperties,
diff --git a/third_party/WebKit/Source/core/frame/UseCounter.cpp b/third_party/WebKit/Source/core/frame/UseCounter.cpp
index 2cbb53d..9f7ca37 100644
--- a/third_party/WebKit/Source/core/frame/UseCounter.cpp
+++ b/third_party/WebKit/Source/core/frame/UseCounter.cpp
@@ -45,7 +45,7 @@
 }
 
 // Make sure update_use_counter_css.py was run which updates histograms.xml.
-constexpr int kMaximumCSSSampleId = 546;
+constexpr int kMaximumCSSSampleId = 547;
 
 }  // namespace
 
@@ -1060,6 +1060,8 @@
       return 545;
     case CSSPropertyTextDecorationSkip:
       return 546;
+    case CSSPropertyCaretColor:
+      return 547;
     // 1. Add new features above this line (don't change the assigned numbers of
     // the existing items).
     // 2. Update kMaximumCSSSampleId with the new maximum value.
diff --git a/third_party/WebKit/Source/core/style/ComputedStyle.cpp b/third_party/WebKit/Source/core/style/ComputedStyle.cpp
index de3d08d..56ac3a2 100644
--- a/third_party/WebKit/Source/core/style/ComputedStyle.cpp
+++ b/third_party/WebKit/Source/core/style/ComputedStyle.cpp
@@ -1129,7 +1129,11 @@
                 m_rareInheritedData->m_textDecorationSkip !=
                     other.m_rareInheritedData->m_textDecorationSkip ||
                 m_rareInheritedData->appliedTextDecorations !=
-                    other.m_rareInheritedData->appliedTextDecorations)) {
+                    other.m_rareInheritedData->appliedTextDecorations ||
+                m_rareInheritedData->caretColor() !=
+                    other.m_rareInheritedData->caretColor() ||
+                m_rareInheritedData->visitedLinkCaretColor() !=
+                    other.m_rareInheritedData->visitedLinkCaretColor())) {
       diff.setTextDecorationOrColorChanged();
     }
   }
@@ -2073,6 +2077,14 @@
           visitedLink ? visitedLinkBorderBottomColor() : borderBottomColor();
       borderStyle = borderBottomStyle();
       break;
+    case CSSPropertyCaretColor: {
+      StyleAutoColor autoColor =
+          visitedLink ? visitedLinkCaretColor() : caretColor();
+      // TODO(rego): We may want to adjust the caret color if it's the same than
+      // the background to ensure good visibility and contrast.
+      result = autoColor.toStyleColor();
+      break;
+    }
     case CSSPropertyColor:
       result = visitedLink ? visitedLinkColor() : color();
       break;
diff --git a/third_party/WebKit/Source/core/style/ComputedStyle.h b/third_party/WebKit/Source/core/style/ComputedStyle.h
index 548a7b3..727c18c 100644
--- a/third_party/WebKit/Source/core/style/ComputedStyle.h
+++ b/third_party/WebKit/Source/core/style/ComputedStyle.h
@@ -2477,6 +2477,11 @@
     SET_VAR(m_rareInheritedData, userSelect, s);
   }
 
+  // caret-color
+  void setCaretColor(const StyleAutoColor& c) {
+    SET_VAR_WITH_SETTER(m_rareInheritedData, caretColor, setCaretColor, c);
+  }
+
   // Font properties.
   const Font& font() const;
   void setFont(const Font&);
@@ -3859,6 +3864,10 @@
     SET_VAR_WITH_SETTER(m_rareInheritedData, visitedLinkTextStrokeColor,
                         setVisitedLinkTextStrokeColor, v);
   }
+  void setVisitedLinkCaretColor(const StyleAutoColor& v) {
+    SET_VAR_WITH_SETTER(m_rareInheritedData, visitedLinkCaretColor,
+                        setVisitedLinkCaretColor, v);
+  }
 
   void inheritUnicodeBidiFrom(const ComputedStyle& parent) {
     m_nonInheritedData.m_unicodeBidi = parent.m_nonInheritedData.m_unicodeBidi;
@@ -3907,6 +3916,9 @@
     return m_surround->border.bottom().color();
   }
   StyleColor backgroundColor() const { return m_background->color(); }
+  StyleAutoColor caretColor() const {
+    return m_rareInheritedData->caretColor();
+  }
   Color color() const;
   StyleColor columnRuleColor() const {
     return m_rareNonInheritedData->m_multiCol->m_rule.color();
@@ -3923,6 +3935,9 @@
   StyleColor textStrokeColor() const {
     return m_rareInheritedData->textStrokeColor();
   }
+  StyleAutoColor visitedLinkCaretColor() const {
+    return m_rareInheritedData->visitedLinkCaretColor();
+  }
   Color visitedLinkColor() const;
   StyleColor visitedLinkBackgroundColor() const {
     return m_rareNonInheritedData->m_visitedLinkBackgroundColor;
diff --git a/third_party/WebKit/Source/core/style/StyleRareInheritedData.cpp b/third_party/WebKit/Source/core/style/StyleRareInheritedData.cpp
index 0c272d7..b2dbf34 100644
--- a/third_party/WebKit/Source/core/style/StyleRareInheritedData.cpp
+++ b/third_party/WebKit/Source/core/style/StyleRareInheritedData.cpp
@@ -39,7 +39,7 @@
   void* styleImage;
   Color firstColor;
   float firstFloat;
-  Color colors[5];
+  Color colors[7];
   void* ownPtrs[1];
   AtomicString atomicStrings[3];
   void* refPtrs[1];
@@ -71,9 +71,13 @@
       m_textStrokeColorIsCurrentColor(true),
       m_textFillColorIsCurrentColor(true),
       m_textEmphasisColorIsCurrentColor(true),
+      m_caretColorIsCurrentColor(false),
+      m_caretColorIsAuto(true),
       m_visitedLinkTextStrokeColorIsCurrentColor(true),
       m_visitedLinkTextFillColorIsCurrentColor(true),
       m_visitedLinkTextEmphasisColorIsCurrentColor(true),
+      m_visitedLinkCaretColorIsCurrentColor(false),
+      m_visitedLinkCaretColorIsAuto(true),
       textSecurity(ComputedStyle::initialTextSecurity()),
       userModify(READ_ONLY),
       wordBreak(ComputedStyle::initialWordBreak()),
@@ -114,9 +118,11 @@
       textStrokeWidth(o.textStrokeWidth),
       m_textFillColor(o.m_textFillColor),
       m_textEmphasisColor(o.m_textEmphasisColor),
+      m_caretColor(o.m_caretColor),
       m_visitedLinkTextStrokeColor(o.m_visitedLinkTextStrokeColor),
       m_visitedLinkTextFillColor(o.m_visitedLinkTextFillColor),
       m_visitedLinkTextEmphasisColor(o.m_visitedLinkTextEmphasisColor),
+      m_visitedLinkCaretColor(o.m_visitedLinkCaretColor),
       textShadow(o.textShadow),
       highlight(o.highlight),
       cursorData(o.cursorData),
@@ -127,12 +133,17 @@
       m_textStrokeColorIsCurrentColor(o.m_textStrokeColorIsCurrentColor),
       m_textFillColorIsCurrentColor(o.m_textFillColorIsCurrentColor),
       m_textEmphasisColorIsCurrentColor(o.m_textEmphasisColorIsCurrentColor),
+      m_caretColorIsCurrentColor(o.m_caretColorIsCurrentColor),
+      m_caretColorIsAuto(o.m_caretColorIsAuto),
       m_visitedLinkTextStrokeColorIsCurrentColor(
           o.m_visitedLinkTextStrokeColorIsCurrentColor),
       m_visitedLinkTextFillColorIsCurrentColor(
           o.m_visitedLinkTextFillColorIsCurrentColor),
       m_visitedLinkTextEmphasisColorIsCurrentColor(
           o.m_visitedLinkTextEmphasisColorIsCurrentColor),
+      m_visitedLinkCaretColorIsCurrentColor(
+          o.m_visitedLinkCaretColorIsCurrentColor),
+      m_visitedLinkCaretColorIsAuto(o.m_visitedLinkCaretColorIsAuto),
       textSecurity(o.textSecurity),
       userModify(o.userModify),
       wordBreak(o.wordBreak),
@@ -178,9 +189,11 @@
          textStrokeWidth == o.textStrokeWidth &&
          m_textFillColor == o.m_textFillColor &&
          m_textEmphasisColor == o.m_textEmphasisColor &&
+         m_caretColor == o.m_caretColor &&
          m_visitedLinkTextStrokeColor == o.m_visitedLinkTextStrokeColor &&
          m_visitedLinkTextFillColor == o.m_visitedLinkTextFillColor &&
          m_visitedLinkTextEmphasisColor == o.m_visitedLinkTextEmphasisColor &&
+         m_visitedLinkCaretColor == o.m_visitedLinkCaretColor &&
          tapHighlightColor == o.tapHighlightColor && shadowDataEquivalent(o) &&
          highlight == o.highlight &&
          dataEquivalent(cursorData.get(), o.cursorData.get()) &&
@@ -190,12 +203,17 @@
          m_textFillColorIsCurrentColor == o.m_textFillColorIsCurrentColor &&
          m_textEmphasisColorIsCurrentColor ==
              o.m_textEmphasisColorIsCurrentColor &&
+         m_caretColorIsCurrentColor == o.m_caretColorIsCurrentColor &&
+         m_caretColorIsAuto == o.m_caretColorIsAuto &&
          m_visitedLinkTextStrokeColorIsCurrentColor ==
              o.m_visitedLinkTextStrokeColorIsCurrentColor &&
          m_visitedLinkTextFillColorIsCurrentColor ==
              o.m_visitedLinkTextFillColorIsCurrentColor &&
          m_visitedLinkTextEmphasisColorIsCurrentColor ==
              o.m_visitedLinkTextEmphasisColorIsCurrentColor &&
+         m_visitedLinkCaretColorIsCurrentColor ==
+             o.m_visitedLinkCaretColorIsCurrentColor &&
+         m_visitedLinkCaretColorIsAuto == o.m_visitedLinkCaretColorIsAuto &&
          textSecurity == o.textSecurity && userModify == o.userModify &&
          wordBreak == o.wordBreak && overflowWrap == o.overflowWrap &&
          lineBreak == o.lineBreak && userSelect == o.userSelect &&
diff --git a/third_party/WebKit/Source/core/style/StyleRareInheritedData.h b/third_party/WebKit/Source/core/style/StyleRareInheritedData.h
index e84256b..ae24bb5 100644
--- a/third_party/WebKit/Source/core/style/StyleRareInheritedData.h
+++ b/third_party/WebKit/Source/core/style/StyleRareInheritedData.h
@@ -26,6 +26,7 @@
 #define StyleRareInheritedData_h
 
 #include "core/CoreExport.h"
+#include "core/css/StyleAutoColor.h"
 #include "core/css/StyleColor.h"
 #include "core/style/TextSizeAdjust.h"
 #include "platform/Length.h"
@@ -87,6 +88,13 @@
     return m_textEmphasisColorIsCurrentColor ? StyleColor::currentColor()
                                              : StyleColor(m_textEmphasisColor);
   }
+  StyleAutoColor caretColor() const {
+    if (m_caretColorIsCurrentColor)
+      return StyleAutoColor::currentColor();
+    if (m_caretColorIsAuto)
+      return StyleAutoColor::autoColor();
+    return StyleAutoColor(m_caretColor);
+  }
   StyleColor visitedLinkTextStrokeColor() const {
     return m_visitedLinkTextStrokeColorIsCurrentColor
                ? StyleColor::currentColor()
@@ -102,6 +110,13 @@
                ? StyleColor::currentColor()
                : StyleColor(m_visitedLinkTextEmphasisColor);
   }
+  StyleAutoColor visitedLinkCaretColor() const {
+    if (m_visitedLinkCaretColorIsCurrentColor)
+      return StyleAutoColor::currentColor();
+    if (m_visitedLinkCaretColorIsAuto)
+      return StyleAutoColor::autoColor();
+    return StyleAutoColor(m_visitedLinkCaretColor);
+  }
 
   void setTextStrokeColor(const StyleColor& color) {
     m_textStrokeColor = color.resolve(Color());
@@ -115,6 +130,11 @@
     m_textEmphasisColor = color.resolve(Color());
     m_textEmphasisColorIsCurrentColor = color.isCurrentColor();
   }
+  void setCaretColor(const StyleAutoColor& color) {
+    m_caretColor = color.resolve(Color());
+    m_caretColorIsCurrentColor = color.isCurrentColor();
+    m_caretColorIsAuto = color.isAutoColor();
+  }
   void setVisitedLinkTextStrokeColor(const StyleColor& color) {
     m_visitedLinkTextStrokeColor = color.resolve(Color());
     m_visitedLinkTextStrokeColorIsCurrentColor = color.isCurrentColor();
@@ -127,15 +147,22 @@
     m_visitedLinkTextEmphasisColor = color.resolve(Color());
     m_visitedLinkTextEmphasisColorIsCurrentColor = color.isCurrentColor();
   }
+  void setVisitedLinkCaretColor(const StyleAutoColor& color) {
+    m_visitedLinkCaretColor = color.resolve(Color());
+    m_visitedLinkCaretColorIsCurrentColor = color.isCurrentColor();
+    m_visitedLinkCaretColorIsAuto = color.isAutoColor();
+  }
 
   Color m_textStrokeColor;
   float textStrokeWidth;
   Color m_textFillColor;
   Color m_textEmphasisColor;
+  Color m_caretColor;
 
   Color m_visitedLinkTextStrokeColor;
   Color m_visitedLinkTextFillColor;
   Color m_visitedLinkTextEmphasisColor;
+  Color m_visitedLinkCaretColor;
 
   RefPtr<ShadowList>
       textShadow;  // Our text shadow information for shadowed text drawing.
@@ -154,9 +181,13 @@
   unsigned m_textStrokeColorIsCurrentColor : 1;
   unsigned m_textFillColorIsCurrentColor : 1;
   unsigned m_textEmphasisColorIsCurrentColor : 1;
+  unsigned m_caretColorIsCurrentColor : 1;
+  unsigned m_caretColorIsAuto : 1;
   unsigned m_visitedLinkTextStrokeColorIsCurrentColor : 1;
   unsigned m_visitedLinkTextFillColorIsCurrentColor : 1;
   unsigned m_visitedLinkTextEmphasisColorIsCurrentColor : 1;
+  unsigned m_visitedLinkCaretColorIsCurrentColor : 1;
+  unsigned m_visitedLinkCaretColorIsAuto : 1;
 
   unsigned textSecurity : 2;          // ETextSecurity
   unsigned userModify : 2;            // EUserModify (editing)
diff --git a/third_party/WebKit/Source/web/tests/WebViewTest.cpp b/third_party/WebKit/Source/web/tests/WebViewTest.cpp
index 909b80f..772090be 100644
--- a/third_party/WebKit/Source/web/tests/WebViewTest.cpp
+++ b/third_party/WebKit/Source/web/tests/WebViewTest.cpp
@@ -3092,9 +3092,9 @@
       "font-weight: normal; letter-spacing: "
       "normal; orphans: 2; text-align: start; "
       "text-indent: 0px; text-transform: none; white-space: normal; widows: "
-      "2; word-spacing: 0px; -webkit-text-stroke-width: 0px; "
-      "text-decoration-style: initial; text-decoration-color: initial;\">Air "
-      "conditioner</div><div id=\"div5\" style=\"padding: 10px; margin: "
+      "2; word-spacing: 0px; -webkit-text-stroke-width: 0px; caret-color: "
+      "auto; text-decoration-style: initial; text-decoration-color: initial;"
+      "\">Air conditioner</div><div id=\"div5\" style=\"padding: 10px; margin: "
       "10px; border: 2px solid skyblue; float: left; width: "
       "190px; height: 30px; color: rgb(0, 0, 0); font-family: myahem; "
       "font-size: 8px; font-style: normal; font-variant-ligatures: normal; "
@@ -3102,8 +3102,9 @@
       "letter-spacing: normal; orphans: 2; "
       "text-align: start; text-indent: 0px; text-transform: "
       "none; white-space: normal; widows: 2; word-spacing: 0px; "
-      "-webkit-text-stroke-width: 0px; text-decoration-style: initial; "
-      "text-decoration-color: initial;\">Price 10,000,000won</div>";
+      "-webkit-text-stroke-width: 0px; caret-color: auto; "
+      "text-decoration-style: initial; text-decoration-color: initial;\">"
+      "Price 10,000,000won</div>";
   WebString clipText;
   WebString clipHtml;
   WebRect clipRect;
@@ -3132,17 +3133,17 @@
       "font-weight: normal; letter-spacing: "
       "normal; orphans: 2; text-align: start; "
       "text-indent: 0px; text-transform: none; white-space: normal; widows: "
-      "2; word-spacing: 0px; -webkit-text-stroke-width: 0px; "
-      "text-decoration-style: initial; text-decoration-color: initial;\">Air "
-      "conditioner</div><div id=\"div5\" style=\"padding: 10px; margin: "
+      "2; word-spacing: 0px; -webkit-text-stroke-width: 0px; caret-color: "
+      "auto; text-decoration-style: initial; text-decoration-color: initial;"
+      "\">Air conditioner</div><div id=\"div5\" style=\"padding: 10px; margin: "
       "10px; border: 2px solid skyblue; float: left; width: "
       "190px; height: 30px; color: rgb(0, 0, 0); font-family: myahem; "
       "font-size: 8px; font-style: normal; font-variant-ligatures: normal; "
       "font-variant-caps: normal; font-weight: normal; letter-spacing: normal; "
       "orphans: 2; text-align: start; text-indent: 0px; "
       "text-transform: none; white-space: normal; widows: 2; "
-      "word-spacing: 0px; -webkit-text-stroke-width: 0px;"
-      " text-decoration-style: initial; text-decoration-color: initial;\">"
+      "word-spacing: 0px; -webkit-text-stroke-width: 0px; caret-color: auto; "
+      "text-decoration-style: initial; text-decoration-color: initial;\">"
       "Price 10,000,000won</div>";
   WebString clipText;
   WebString clipHtml;