[kbn-scout][maps] waitForRenderComplete (#211265)

## Summary

This PR add a method to wait for map to be loaded to replace generic
`renderable.waitForRender()`.

While investigating the recent test failure on CI I found out that for
maps case we can simplify the logic with few facts:
- before start waiting for render to complete, we need to wait for main
container `#maps-plugin` to be in DOM. It takes 2-3 seconds.
- there is always a single div block with `data-render-complete`
attribute, and there is a comment in source code stating `See if the
"data-render-complete" attribute is "true". If so we're done!` which
means we can simply wait for
`div[data-dom-id][data-render-complete="true"]`


6de2ef0e6d/x-pack/platform/plugins/shared/maps/public/connected_components/map_container/map_container.tsx (L103-L116)

`renderable.waitForRender()` is a good waiter, but probably for
dashboard with multiple panels.

packages/kbn-scout/src/playwright/page_objects/maps_page.ts

@@ -9,10 +9,21 @@
 
 import { ScoutPage } from '..';
 
+const DEFAULT_MAP_LOADING_TIMEOUT = 10_000;
+
 export class MapsPage {
   constructor(private readonly page: ScoutPage) {}
 
   async gotoNewMap() {
-    await this.page.gotoApp('maps/map');
+    return this.page.gotoApp('maps/map');
+  }
+
+  async waitForRenderComplete() {
+    // first wait for the top level container to be present
+    await this.page.locator('div#maps-plugin').waitFor({ timeout: DEFAULT_MAP_LOADING_TIMEOUT });
+    // then wait for the map to be fully rendered
+    return this.page
+      .locator('div[data-dom-id][data-render-complete="true"]')
+      .waitFor({ timeout: DEFAULT_MAP_LOADING_TIMEOUT });
   }
 }

x-pack/platform/plugins/shared/maps/ui_tests/tests/full_screen_mode.spec.ts

@@ -22,7 +22,7 @@ test.describe(
     test.beforeEach(async ({ browserAuth, pageObjects }) => {
       await browserAuth.loginAsViewer();
       await pageObjects.maps.gotoNewMap();
-      await pageObjects.renderable.waitForRender();
+      await pageObjects.maps.waitForRenderComplete();
     });
 
     test('Full screen mode', async ({ page }) => {