migrate(e2e): suggest from Protractor to Playwright

Agent-Logs-Url: https://github.com/superdesk/superdesk-client-core/sessions/d3f35282-bf9b-42d6-bdbd-8360c01fcd7d

Co-authored-by: eos87 <124766+eos87@users.noreply.github.com>

e2e/MIGRATION_REPORT.md

@@ -5,7 +5,7 @@
 
 ## Totals
 - Original non-Playwright specs: 30
-- Migrated: 3
+- Migrated: 4
 - Blocked: 0 (see below)
 - Obsolete: 0 (see below)
 - Flaky: 0 (see below)
@@ -14,7 +14,8 @@
 ## Migrated specs
 - Protractor `e2e/client/specs/workspace_spec.ts` -> `e2e/client/playwright/workspace.spec.ts` [65a6ef935] — Given the authenticated user is on the dashboard, when they use the workspace hotkeys, then the app switches to monitoring, spiked, personal, search, and back to dashboard.
 - Protractor `e2e/client/specs/vocabularies_spec.ts` -> `e2e/client/playwright/vocabularies.spec.ts` [4b719937a] — Given the vocabularies settings page is open, when the user edits the Categories vocabulary name and cancels, then the original vocabulary data is restored.
-- Protractor `e2e/client/specs/subscribers_spec.ts` -> `e2e/client/playwright/subscribers.spec.ts` [pending] — Given the publish settings page is open, when the user inspects and edits the default subscriber from the snapshot, then the list shows that subscriber and the save button only enables after changing the target type and destination format.
+- Protractor `e2e/client/specs/subscribers_spec.ts` -> `e2e/client/playwright/subscribers.spec.ts` [a50a98854] — Given the publish settings page is open, when the user inspects and edits the default subscriber from the snapshot, then the list shows that subscriber and the save button only enables after changing the target type and destination format.
+- Protractor `e2e/client/specs/suggest_spec.ts` -> `e2e/client/playwright/suggest.spec.ts` [pending] — Given an authenticated user opens a new text item, when they open Live suggestions before changing the body, then the suggestions list is empty.
 
 ## Blocked
 - None yet.
@@ -30,6 +31,7 @@
 
 ## Product source changes
 - `scripts/apps/publish/views/subscribers.html` — `data-test-id` added to subscriber list rows — for `e2e/client/playwright/subscribers.spec.ts`
+- `scripts/apps/authoring/suggest/SuggestView.html` — `data-test-id` added to the live suggestions list and items — for `e2e/client/playwright/suggest.spec.ts`
 
 ## Frameworks removed
 - None yet.

e2e/client/playwright/suggest.spec.ts

@@ -0,0 +1,19 @@
+import {test, expect} from '@playwright/test';
+import {Monitoring} from './page-object-models/monitoring';
+import {Authoring} from './page-object-models/authoring';
+import {restoreDatabaseSnapshot, s} from './utils';
+
+test('live suggestions opens with no items', async ({page}) => {
+    const monitoring = new Monitoring(page);
+    const authoring = new Authoring(page);
+
+    await restoreDatabaseSnapshot();
+    await page.goto('/#/workspace/monitoring');
+    await monitoring.selectDeskOrWorkspace('Sports');
+
+    await monitoring.createArticleFromTemplate('story');
+    await authoring.executeActionInEditor('Live suggestions');
+
+    await expect(page.locator(s('live-suggestions'))).toBeVisible();
+    await expect(page.locator(s('live-suggestions', 'suggestion-item'))).toHaveCount(0);
+});

scripts/apps/authoring/suggest/SuggestView.html

@@ -1,13 +1,13 @@
-<div class="live-suggest">
+<div class="live-suggest" data-test-id="live-suggestions">
 	<div ng-show="showItem === null" class="item-list">
 		<div class="live-suggest__header subnav">
 			<h3 class="subnav__page-title" translate>Live Suggestions</h3>
 			<a class="close" ng-click="ctrl.close()"><i class="icon-close-small"></i></a>
 		</div>
 		<div class="live-suggest__body">
 			<h6 class="no-suggestions" ng-hide="items" translate>Suggestions will appear here once the article's body starts changing...</h6>
-			<ul sd-list-view class="list-view compact-view" data-items="items" ng-show="items">
-				<li class="media-box" ng-click="ctrl.showItem(item)">
+			<ul sd-list-view class="list-view compact-view" data-items="items" ng-show="items" data-test-id="suggestions-list">
+				<li class="media-box" ng-click="ctrl.showItem(item)" data-test-id="suggestion-item">
 					<div class="line item-info">
 						<i sd-filetype-icon data-item="item"></i>
 						<span class="keyword">{{ item.slugline || '-' }}</span>