diff --git a/dom/base/nsStyleLinkElement.cpp b/dom/base/nsStyleLinkElement.cpp
index 2e5bae0da621..3ae59218916e 100644
--- a/dom/base/nsStyleLinkElement.cpp
+++ b/dom/base/nsStyleLinkElement.cpp
@@ -97,13 +97,15 @@ void nsStyleLinkElement::GetTitleAndMediaForElement(const Element& aSelf,
   nsContentUtils::ASCIIToLower(aMedia);
 }
 
-bool nsStyleLinkElement::IsCSSMimeTypeAttribute(const Element& aSelf) {
+bool nsStyleLinkElement::IsCSSMimeTypeAttributeForStyleElement(
+    const Element& aSelf) {
+  // Per
+  // https://html.spec.whatwg.org/multipage/semantics.html#the-style-element:update-a-style-block
+  // step 4, for style elements we should only accept empty and "text/css" type
+  // attribute values.
   nsAutoString type;
-  nsAutoString mimeType;
-  nsAutoString notUsed;
   aSelf.GetAttr(kNameSpaceID_None, nsGkAtoms::type, type);
-  nsContentUtils::SplitMimeType(type, mimeType, notUsed);
-  return mimeType.IsEmpty() || mimeType.LowerCaseEqualsLiteral("text/css");
+  return type.IsEmpty() || type.LowerCaseEqualsLiteral("text/css");
 }
 
 void nsStyleLinkElement::Unlink() {
diff --git a/dom/base/nsStyleLinkElement.h b/dom/base/nsStyleLinkElement.h
index 39e1c9adf8fd..233f026c7a2d 100644
--- a/dom/base/nsStyleLinkElement.h
+++ b/dom/base/nsStyleLinkElement.h
@@ -100,8 +100,10 @@ class nsStyleLinkElement : public nsIStyleSheetLinkingElement {
   static void GetTitleAndMediaForElement(const mozilla::dom::Element&,
                                          nsString& aTitle, nsString& aMedia);
 
-  // Returns whether the type attribute specifies the text/css mime type.
-  static bool IsCSSMimeTypeAttribute(const mozilla::dom::Element&);
+  // Returns whether the type attribute specifies the text/css type for style
+  // elements.
+  static bool IsCSSMimeTypeAttributeForStyleElement(
+      const mozilla::dom::Element&);
 
   virtual mozilla::Maybe<SheetInfo> GetStyleSheetInfo() = 0;
 
diff --git a/dom/html/HTMLLinkElement.cpp b/dom/html/HTMLLinkElement.cpp
index 6968f7f58854..39d496c86640 100644
--- a/dom/html/HTMLLinkElement.cpp
+++ b/dom/html/HTMLLinkElement.cpp
@@ -440,7 +440,7 @@ Maybe<nsStyleLinkElement::SheetInfo> HTMLLinkElement::GetStyleSheetInfo() {
     return Nothing();
   }
 
-  if (!IsCSSMimeTypeAttribute(*this)) {
+  if (!IsCSSMimeTypeAttributeForLinkElement(*this)) {
     return Nothing();
   }
 
@@ -876,5 +876,18 @@ bool HTMLLinkElement::CheckPreloadAttrs(const nsAttrValue& aAs,
   return false;
 }
 
+bool HTMLLinkElement::IsCSSMimeTypeAttributeForLinkElement(
+    const Element& aSelf) {
+  // Processing the type attribute per
+  // https://html.spec.whatwg.org/multipage/semantics.html#processing-the-type-attribute
+  // for HTML link elements.
+  nsAutoString type;
+  nsAutoString mimeType;
+  nsAutoString notUsed;
+  aSelf.GetAttr(kNameSpaceID_None, nsGkAtoms::type, type);
+  nsContentUtils::SplitMimeType(type, mimeType, notUsed);
+  return mimeType.IsEmpty() || mimeType.LowerCaseEqualsLiteral("text/css");
+}
+
 }  // namespace dom
 }  // namespace mozilla
diff --git a/dom/html/HTMLLinkElement.h b/dom/html/HTMLLinkElement.h
index 3b312754ff39..eabca7b6bf38 100644
--- a/dom/html/HTMLLinkElement.h
+++ b/dom/html/HTMLLinkElement.h
@@ -185,6 +185,11 @@ class HTMLLinkElement final : public nsGenericHTMLElement,
                      const nsAttrValue* aOldValue);
   void CancelPrefetchOrPreload();
 
+  // Returns whether the type attribute specifies the text/css mime type for
+  // link elements.
+  static bool IsCSSMimeTypeAttributeForLinkElement(
+      const mozilla::dom::Element&);
+
   // nsStyleLinkElement
   Maybe<SheetInfo> GetStyleSheetInfo() final;
 
diff --git a/dom/html/HTMLStyleElement.cpp b/dom/html/HTMLStyleElement.cpp
index 45d5744b7c46..838304469183 100644
--- a/dom/html/HTMLStyleElement.cpp
+++ b/dom/html/HTMLStyleElement.cpp
@@ -164,7 +164,7 @@ void HTMLStyleElement::SetTextContentInternal(const nsAString& aTextContent,
 }
 
 Maybe<nsStyleLinkElement::SheetInfo> HTMLStyleElement::GetStyleSheetInfo() {
-  if (!IsCSSMimeTypeAttribute(*this)) {
+  if (!IsCSSMimeTypeAttributeForStyleElement(*this)) {
     return Nothing();
   }
 
diff --git a/dom/svg/SVGStyleElement.cpp b/dom/svg/SVGStyleElement.cpp
index 5d97a89a76b0..598d0a7851cc 100644
--- a/dom/svg/SVGStyleElement.cpp
+++ b/dom/svg/SVGStyleElement.cpp
@@ -172,7 +172,7 @@ void SVGStyleElement::SetTitle(const nsAString& aTitle, ErrorResult& rv) {
 // nsStyleLinkElement methods
 
 Maybe<nsStyleLinkElement::SheetInfo> SVGStyleElement::GetStyleSheetInfo() {
-  if (!IsCSSMimeTypeAttribute(*this)) {
+  if (!IsCSSMimeTypeAttributeForStyleElement(*this)) {
     return Nothing();
   }
 
diff --git a/testing/web-platform/meta/html/semantics/document-metadata/the-style-element/style_type.html.ini b/testing/web-platform/meta/html/semantics/document-metadata/the-style-element/style_type.html.ini
deleted file mode 100644
index 9306953ccb0a..000000000000
--- a/testing/web-platform/meta/html/semantics/document-metadata/the-style-element/style_type.html.ini
+++ /dev/null
@@ -1,7 +0,0 @@
-[style_type.html]
-  [With a whitespace-surrounded type attribute, the style should not apply]
-    expected: FAIL
-
-  [With a charset parameter in the type attribute, the style should not apply]
-    expected: FAIL
-
diff --git a/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type.svg b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type.svg
new file mode 100644
index 000000000000..6b0d1e874e32
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/document-metadata/the-style-element/style_type.svg
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:h="http://www.w3.org/1999/xhtml"
+     width="800px" height="8000px">
+  <title>&lt;style&gt; type="" edge cases</title>
+  <metadata>
+    <h:link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#update-a-style-block"/>
+  </metadata>
+  <h:script src="/resources/testharness.js"/>
+  <h:script src="/resources/testharnessreport.js"/>
+
+  <style>
+  #test1 { color: rgb(0, 128, 0); }
+  </style>
+
+  <style type="">
+  #test2 { color: rgb(0, 128, 0); }
+  </style>
+
+  <style type="TEXT/CsS">
+  #test3 { color: rgb(0, 128, 0); }
+  </style>
+
+  <style type=" text/css ">
+  #test4 { color: rgb(0, 128, 0); }
+  </style>
+
+  <style type="text/css; charset=utf-8">
+  #test5 { color: rgb(0, 128, 0); }
+  </style>
+
+  <h:body>
+    <h:div id="test1"/>
+    <h:div id="test2"/>
+    <h:div id="test3"/>
+    <h:div id="test4"/>
+    <h:div id="test5"/>
+
+    <h:script><![CDATA[
+    "use strict";
+
+    test(() => {
+      assertApplied("test1");
+    }, "With no type attribute, the style should apply");
+
+    test(() => {
+      assertApplied("test2");
+    }, "With an empty type attribute, the style should apply");
+
+    test(() => {
+      assertApplied("test3");
+    }, "With a mixed-case type attribute, the style should apply");
+
+    test(() => {
+      assertNotApplied("test4");
+    }, "With a whitespace-surrounded type attribute, the style should not apply");
+
+    test(() => {
+      assertNotApplied("test5");
+    }, "With a charset parameter in the type attribute, the style should not apply");
+
+    function getColor(id) {
+      return window.getComputedStyle(document.getElementById(id)).color;
+    }
+
+    function assertApplied(id) {
+      assert_equals(getColor(id), "rgb(0, 128, 0)");
+    }
+
+    function assertNotApplied(id) {
+      assert_not_equals(getColor(id), "rgb(0, 128, 0)");
+    }
+    ]]></h:script>
+  </h:body>
+</svg>