test: add validation tests for invalid feed URLs in classic block

Author: RaduCristianPopescu

js/FeedzyLoop/placeholder.js

@@ -115,7 +115,7 @@ const BlockPlaceholder = ({ attributes, setAttributes, onSaveFeed }) => {
 		return (
 			<div
 				className="feedzy-validation-results"
-				style={{ 
+				style={{
 					display: 'flex',
 					flexDirection: 'column',
 					gap: '10px',
@@ -154,7 +154,8 @@ const BlockPlaceholder = ({ attributes, setAttributes, onSaveFeed }) => {
 						{isValidating
 							? __(
 									'Validating and fetching feed…',
-									'feedzy-rss-feeds')
+									'feedzy-rss-feeds'
+								)
 							: __('Loading…', 'feedzy-rss-feeds')}
 					</p>
 				</div>
@@ -195,11 +196,7 @@ const BlockPlaceholder = ({ attributes, setAttributes, onSaveFeed }) => {
 					</BaseControl>
 
 					<div>
-						<Button
-							variant="primary"
-							onClick={handleLoadFeed}
-							disabled={!attributes?.feed?.source}
-						>
+						<Button variant="primary" onClick={handleLoadFeed}>
 							{__('Load Feed', 'feedzy-rss-feeds')}
 						</Button>
 					</div>

tests/e2e/specs/classic-block.spec.js

@@ -0,0 +1,45 @@
+/**
+ * WordPress dependencies
+ */
+import { test, expect } from '@wordpress/e2e-test-utils-playwright';
+
+test.describe('Feedzy Classic Block', () => {
+	test('check validation for invalid URL', async ({ editor, page, admin }) => {
+		await admin.createNewPost();
+
+        await editor.insertBlock({
+			name: 'feedzy-rss-feeds/feedzy-block',
+		});
+
+        await page.getByPlaceholder('Enter URL or group of your').fill(
+			'http://invalid-url.com/feed'
+		);
+
+        await page.getByRole('button', { name: 'Load Feed' }).click();
+
+        await page.waitForSelector('.feedzy-validation-results');
+        
+		await expect( page.locator('.feedzy-validation-results .is-error').getByText('http://invalid-url.com/feed', { exact: true }) ).toBeVisible();
+	});
+
+    test('check validation for invalid and valid URL', async ({ editor, page, admin }) => {
+		await admin.createNewPost();
+
+        await editor.insertBlock({
+			name: 'feedzy-rss-feeds/feedzy-block',
+		});
+
+        await page.getByPlaceholder('Enter URL or group of your').fill(
+			'http://invalid-url.com/feed, https://www.nasa.gov/feeds/iotd-feed/'
+		);
+
+        await page.getByRole('button', { name: 'Load Feed' }).click();
+
+        await page.waitForSelector('.feedzy-validation-results');
+        
+		await expect( page.locator('.feedzy-validation-results .is-error').getByText('http://invalid-url.com/feed', { exact: true }) ).toBeVisible();
+
+        await expect( page.locator('.feedzy-validation-results .is-success').getByText('https://www.nasa.gov/feeds/iotd-feed/', { exact: true }) ).toBeVisible();
+	});
+
+});

tests/e2e/specs/loop.spec.js

@@ -106,4 +106,40 @@ test.describe('Feedzy Loop', () => {
 		const feedzyLoopChildren = await feedzyLoop.$$(':scope > *');
 		expect(feedzyLoopChildren.length).toBe(5);
 	});
+
+	test('check validation for invalid URL', async ({ editor, page, admin }) => {
+		await admin.createNewPost();
+
+		await editor.insertBlock({
+			name: 'feedzy-rss-feeds/loop',
+		});
+
+		await page.getByPlaceholder('Enter URLs or select a Feed').fill(
+			'http://invalid-url.com/feed'
+		);
+		await page.getByRole('button', { name: 'Load Feed' }).click();
+
+		await page.waitForSelector('.feedzy-validation-results');
+
+		await expect( page.locator('.feedzy-validation-results .is-error').getByText('http://invalid-url.com/feed', { exact: true }) ).toBeVisible();
+	});
+
+	test('check validation for invalid and valid url', async ({ editor, page, admin }) => {
+		await admin.createNewPost();
+
+		await editor.insertBlock({
+			name: 'feedzy-rss-feeds/loop',
+		});
+
+		await page.getByPlaceholder('Enter URLs or select a Feed').fill(
+			'http://invalid-url.com/feed, https://www.nasa.gov/feeds/iotd-feed/'
+		);
+		await page.getByRole('button', { name: 'Load Feed' }).click();
+
+		await page.waitForSelector('.feedzy-validation-results');
+
+		await expect( page.locator('.feedzy-validation-results .is-error').getByText('http://invalid-url.com/feed', { exact: true }) ).toBeVisible();
+
+		await expect( page.locator('.feedzy-validation-results .is-success').getByText('https://www.nasa.gov/feeds/iotd-feed/', { exact: true }) ).toBeVisible();
+	});
 });