From 9788eaae861e51b0c2b13515ee5587354204bff0 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Fri, 11 Aug 2023 13:57:21 +1000
Subject: [PATCH] Add tests for fluid layout + typography

---
 .../global-styles/test/typography-utils.js           | 10 ++++++++++
 phpunit/block-supports/typography-test.php           |  5 +++++
 .../block-theme-child-with-fluid-layout/style.css    |  8 ++++++++
 .../block-theme-child-with-fluid-layout/theme.json   | 12 ++++++++++++
 4 files changed, 35 insertions(+)
 create mode 100644 phpunit/data/themedir1/block-theme-child-with-fluid-layout/style.css
 create mode 100644 phpunit/data/themedir1/block-theme-child-with-fluid-layout/theme.json

diff --git a/packages/block-editor/src/components/global-styles/test/typography-utils.js b/packages/block-editor/src/components/global-styles/test/typography-utils.js
index a03b5f2552dad..79526c2fabb09 100644
--- a/packages/block-editor/src/components/global-styles/test/typography-utils.js
+++ b/packages/block-editor/src/components/global-styles/test/typography-utils.js
@@ -606,6 +606,16 @@ describe( 'typography utils', () => {
 				},
 				expected: { fluid: { maxViewportWidth: '10px' } },
 			},
+			{
+				message: 'should not merge `layout.wideSize` if it is fluid',
+				settings: {
+					typography: { fluid: { minFontSize: '16px' } },
+					layout: { wideSize: 'clamp(1000px, 85vw, 2000px)' },
+				},
+				expected: {
+					fluid: { minFontSize: '16px' },
+				},
+			},
 		].forEach( ( { message, settings, expected } ) => {
 			it( `${ message }`, () => {
 				expect(
diff --git a/phpunit/block-supports/typography-test.php b/phpunit/block-supports/typography-test.php
index 2de0da0af799e..f6d5344222678 100644
--- a/phpunit/block-supports/typography-test.php
+++ b/phpunit/block-supports/typography-test.php
@@ -686,6 +686,11 @@ public function data_generate_block_supports_font_size_fixtures() {
 				'theme_slug'      => 'block-theme-child-with-fluid-typography-config',
 				'expected_output' => 'font-size:15px;',
 			),
+			'returns clamp value using default config if layout is fluid' => array(
+				'font_size_value' => '15px',
+				'theme_slug'      => 'block-theme-child-with-fluid-layout',
+				'expected_output' => 'font-size:clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.078), 15px);',
+			),
 		);
 	}
 
diff --git a/phpunit/data/themedir1/block-theme-child-with-fluid-layout/style.css b/phpunit/data/themedir1/block-theme-child-with-fluid-layout/style.css
new file mode 100644
index 0000000000000..193b8f098af64
--- /dev/null
+++ b/phpunit/data/themedir1/block-theme-child-with-fluid-layout/style.css
@@ -0,0 +1,8 @@
+/*
+Theme Name: Block Theme Child Theme With Fluid Layout
+Theme URI: https://wordpress.org/
+Description: For testing purposes only.
+Template: block-theme
+Version: 1.0.0
+Text Domain: block-theme-child-with-fluid-layout
+*/
diff --git a/phpunit/data/themedir1/block-theme-child-with-fluid-layout/theme.json b/phpunit/data/themedir1/block-theme-child-with-fluid-layout/theme.json
new file mode 100644
index 0000000000000..6985da16c6063
--- /dev/null
+++ b/phpunit/data/themedir1/block-theme-child-with-fluid-layout/theme.json
@@ -0,0 +1,12 @@
+{
+	"version": 2,
+	"settings": {
+		"appearanceTools": true,
+		"layout": {
+			"wideSize": "clamp(1000px, 85vw, 2000px)"
+		},
+		"typography": {
+			"fluid": true
+		}
+	}
+}