diff --git a/src/__tests__/functional-tests/ssr.test.ts b/src/__tests__/functional-tests/ssr.test.ts
index ba5d1f0150..4c3db1387d 100644
--- a/src/__tests__/functional-tests/ssr.test.ts
+++ b/src/__tests__/functional-tests/ssr.test.ts
@@ -24,6 +24,14 @@ afterEach(() => {
 
 const vrOnlyComponents = ['app-layout-toolbar'];
 
+// Components whose entire tree is rendered through a portal. The server renderer has no
+// container to portal into, so none of their content reaches the server markup. Portal
+// itself renders a hidden placeholder element in its place, so that the markup matches
+// the first client render and hydration succeeds; the client replaces it on the first
+// commit. Older component-toolkit versions emit nothing at all, hence the optional match.
+const portaledComponents = ['modal', 'tooltip'];
+const emptyOrHiddenPlaceholder = /^(<span style="display:none"><\/span>)?$/;
+
 test('ensure is it not DOM', () => {
   expect(typeof window).toBe('undefined');
   expect(typeof CSS).toBe('undefined');
@@ -34,9 +42,9 @@ for (const componentName of getAllComponents().filter(component => vrOnlyCompone
     const { default: Component } = requireComponent(componentName);
     const props = getRequiredPropsForComponent(componentName);
     const content = renderToStaticMarkup(React.createElement(Component, props, 'test content'));
-    if (componentName === 'modal' || componentName === 'tooltip') {
-      // modal and tooltip use portal API which does not work on server and returns an empty content
-      expect(content.length).toEqual(0);
+    if (portaledComponents.indexOf(componentName) !== -1) {
+      expect(content).not.toContain('test content');
+      expect(content).toMatch(emptyOrHiddenPlaceholder);
     } else {
       expect(content.length).toBeGreaterThan(0);
     }