From 8109b9b1c950a7371f965be9dd1d8b19b64796f0 Mon Sep 17 00:00:00 2001
From: GatsbyJS Bot <core-team@gatsbyjs.com>
Date: Fri, 13 Jan 2023 01:58:45 -0500
Subject: [PATCH] fix(gatsby): Use correct settings for yaml-loader (#37454)
 (#37463)

* fix

* add e2e test

(cherry picked from commit 3ef4f444e8e5aca7866794512bfc367d5a2b057b)

Co-authored-by: Lennart <lekoarts@gmail.com>
---
 .../cypress/integration/functionality/yaml.js    | 11 +++++++++++
 .../src/pages/webpack-loader/yaml.js             | 16 ++++++++++++++++
 .../src/test-files/input.yaml                    |  4 ++++
 packages/gatsby/src/utils/webpack-utils.ts       |  5 ++++-
 4 files changed, 35 insertions(+), 1 deletion(-)
 create mode 100644 e2e-tests/development-runtime/cypress/integration/functionality/yaml.js
 create mode 100644 e2e-tests/development-runtime/src/pages/webpack-loader/yaml.js
 create mode 100644 e2e-tests/development-runtime/src/test-files/input.yaml

diff --git a/e2e-tests/development-runtime/cypress/integration/functionality/yaml.js b/e2e-tests/development-runtime/cypress/integration/functionality/yaml.js
new file mode 100644
index 0000000000000..c7222803583b6
--- /dev/null
+++ b/e2e-tests/development-runtime/cypress/integration/functionality/yaml.js
@@ -0,0 +1,11 @@
+describe(`webpack-loader: yaml`, () => {
+  beforeEach(() => {
+    cy.visit(`/webpack-loader/yaml/`).waitForRouteChange()
+  })
+
+  it(`outputs the YAML file as JSON`, () => {
+    cy.getTestElement(`webpack-loader-yaml`)
+      .invoke(`text`)
+      .should(`eq`, `[{"name":"Paul"},{"name":"Leto II"},{"name":"Ghanima"},{"name":"Alia"}]`)
+  })
+})
\ No newline at end of file
diff --git a/e2e-tests/development-runtime/src/pages/webpack-loader/yaml.js b/e2e-tests/development-runtime/src/pages/webpack-loader/yaml.js
new file mode 100644
index 0000000000000..c3420b53da368
--- /dev/null
+++ b/e2e-tests/development-runtime/src/pages/webpack-loader/yaml.js
@@ -0,0 +1,16 @@
+import * as React from "react"
+import Layout from "../../components/layout"
+
+import inputYaml from "../../test-files/input.yaml"
+
+const YamlPage = () => (
+  <Layout>
+    <pre>
+      <code data-testid="webpack-loader-yaml">
+        {JSON.stringify(inputYaml, null, 0)}
+      </code>
+    </pre>
+  </Layout>
+)
+
+export default YamlPage
\ No newline at end of file
diff --git a/e2e-tests/development-runtime/src/test-files/input.yaml b/e2e-tests/development-runtime/src/test-files/input.yaml
new file mode 100644
index 0000000000000..ac8e9a044492f
--- /dev/null
+++ b/e2e-tests/development-runtime/src/test-files/input.yaml
@@ -0,0 +1,4 @@
+- name: Paul
+- name: Leto II
+- name: Ghanima
+- name: Alia
diff --git a/packages/gatsby/src/utils/webpack-utils.ts b/packages/gatsby/src/utils/webpack-utils.ts
index 076f914028db9..5af187c80ebdc 100644
--- a/packages/gatsby/src/utils/webpack-utils.ts
+++ b/packages/gatsby/src/utils/webpack-utils.ts
@@ -232,8 +232,11 @@ export const createWebpackUtils = (
     },
     yaml: (options = {}) => {
       return {
-        options,
         loader: require.resolve(`yaml-loader`),
+        options: {
+          asJSON: true,
+          ...options,
+        },
       }
     },