From 146fe9c430f03627b0efaf553af842794519a9e2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9mi=20Doreau?= Date: Mon, 12 Jul 2021 17:42:09 +0200 Subject: [PATCH] feat(cypress): update techdocs MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Rémi Doreau --- .gitignore | 3 + cypress/fixtures/docs/sub-page-one.md | 128 +++++++++++---- cypress/fixtures/docs/sub-page-three.md | 132 ++++++++++++--- cypress/fixtures/docs/sub-page-two.md | 155 +++++++++++++++--- cypress/fixtures/mkdocs.yml | 8 +- .../src/integration/plugins/techdocs.spec.ts | 52 ++---- cypress/src/support/commands.ts | 29 ++++ cypress/src/types.d.ts | 12 +- yarn.lock | 29 ++-- 9 files changed, 404 insertions(+), 144 deletions(-) diff --git a/.gitignore b/.gitignore index 57ad74c5cc..8c37280023 100644 --- a/.gitignore +++ b/.gitignore @@ -133,3 +133,6 @@ site # Sensitive credentials *-credentials.yaml + +# e2e tests +cypress/cypress/* diff --git a/cypress/fixtures/docs/sub-page-one.md b/cypress/fixtures/docs/sub-page-one.md index 2289445805..7c451efeb5 100644 --- a/cypress/fixtures/docs/sub-page-one.md +++ b/cypress/fixtures/docs/sub-page-one.md @@ -1,37 +1,109 @@ -# Subpage 1 +# Sub-page 1 ## Section 1.1 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ## Section 1.2 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ## Section 1.3 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! diff --git a/cypress/fixtures/docs/sub-page-three.md b/cypress/fixtures/docs/sub-page-three.md index 8d00ab5730..e9a439ed98 100644 --- a/cypress/fixtures/docs/sub-page-three.md +++ b/cypress/fixtures/docs/sub-page-three.md @@ -1,41 +1,121 @@ -# Subpage 3 +# Sub-page 3 ## Section 3.1 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ## Section 3.2 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ### Sub-Section 3.2.1 -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ### Sub-Section 3.2.2 -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ## Section 3.3 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! diff --git a/cypress/fixtures/docs/sub-page-two.md b/cypress/fixtures/docs/sub-page-two.md index e5acc4aba5..eb2344e9c3 100644 --- a/cypress/fixtures/docs/sub-page-two.md +++ b/cypress/fixtures/docs/sub-page-two.md @@ -1,43 +1,146 @@ -# Subpage 2 +# Sub-page 2 ## Section 2.1 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ## Section 2.2 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ### Sub-Section 2.2.1 -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ### Sub-Section 2.2.2 -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! ## Section 2.3 -Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eleifend posuere varius. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque eu vulputate dolor. Duis aliquet ex non velit tincidunt, a congue justo mollis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at condimentum turpis. Praesent non vestibulum mi. Sed tellus arcu, lobortis non convallis quis, dignissim vel mauris. Donec ultrices consectetur turpis eu mollis. - -Etiam auctor sem est, vitae tempor augue ornare vitae. Sed pulvinar imperdiet enim, id tempor risus varius vel. Sed dictum ex eget est bibendum egestas. Mauris quis turpis commodo turpis luctus gravida. Nulla facilisis ligula turpis, nec luctus odio rhoncus nec. Nam sed faucibus turpis. Suspendisse imperdiet sem ut justo porta commodo. Maecenas vitae blandit libero. Vivamus consequat interdum nunc at porta. Praesent ut magna viverra, tristique nulla in, condimentum lorem. - -Suspendisse potenti. Quisque facilisis nisl enim, non ultrices ligula vehicula vitae. Ut eleifend cursus semper. Cras sed congue tortor. Aliquam at porta ante, vitae pretium diam. Curabitur tincidunt lorem vitae augue tincidunt convallis. Pellentesque eget neque vitae libero dignissim dictum. Nullam vitae ipsum accumsan risus auctor dapibus. Cras erat nunc, rhoncus venenatis ultrices vel, bibendum vitae nibh. Aliquam condimentum eget purus non faucibus. Suspendisse at sem dictum, facilisis sapien sit amet, eleifend nisl. Maecenas urna ante, fringilla aliquam efficitur quis, interdum quis mauris. Nunc molestie risus vitae metus tincidunt, non laoreet libero volutpat. Proin eu tellus lectus. Pellentesque at tincidunt leo, porttitor vehicula orci. - -Vivamus mollis libero nec ex consectetur, ac faucibus magna tristique. Praesent maximus sem tristique lectus faucibus, ac semper velit venenatis. Donec mattis auctor turpis vitae scelerisque. Sed at ipsum vitae odio viverra porta quis eget urna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vulputate lorem euismod venenatis suscipit. Aenean condimentum vel nulla quis tristique. Sed nisi ante, imperdiet nec dolor nec, interdum pharetra eros. Proin egestas vestibulum malesuada. - -Aliquam erat volutpat. Suspendisse ornare nisl in mauris tristique semper. In et odio finibus lorem dapibus sollicitudin nec ut elit. Cras laoreet luctus luctus. Suspendisse a enim dolor. Aliquam ac eros maximus, dictum dolor vel, placerat metus. Cras auctor arcu justo, nec fermentum dui cursus eu. Duis id ultrices diam. Vivamus quis dictum diam, nec gravida tellus. +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! +To next page! [Link to Section 1.1](sub-page-one.md#section-11) diff --git a/cypress/fixtures/mkdocs.yml b/cypress/fixtures/mkdocs.yml index f4def221c3..2362fab898 100644 --- a/cypress/fixtures/mkdocs.yml +++ b/cypress/fixtures/mkdocs.yml @@ -2,9 +2,9 @@ site_name: e2e Fixture Documentation site_description: Documentation used for end-to-end tests of TechDocs in Backstage. nav: - Home: index.md - - Subpage 1: sub-page-one.md - - Subpage 2: sub-page-two.md - - Nested Subpages: - - Subpage 3: sub-page-three.md + - Sub-page 1: sub-page-one.md + - Sub-page 2: sub-page-two.md + - Nested Sub-pages: + - Sub-page 3: sub-page-three.md plugins: - techdocs-core diff --git a/cypress/src/integration/plugins/techdocs.spec.ts b/cypress/src/integration/plugins/techdocs.spec.ts index 14aa5c5f8c..41f4d8adba 100644 --- a/cypress/src/integration/plugins/techdocs.spec.ts +++ b/cypress/src/integration/plugins/techdocs.spec.ts @@ -27,6 +27,8 @@ describe('TechDocs', () => { describe('Navigating to TechDocs', () => { it('should navigate to the TechDocs home page via the primary navigation bar', () => { cy.visit('/'); + cy.wait(500); + cy.get('[data-testid="sidebar-root"]') .get('div') .get('a[href="/docs"]') @@ -37,6 +39,9 @@ describe('TechDocs', () => { it('should navigate to the TechDocs home page from the URL', () => { cy.visit('/docs'); + + cy.wait(500); + cy.contains('Documentation'); }); @@ -55,18 +60,6 @@ describe('TechDocs', () => { }); }); - it('should navigate to a specific TechDocs entity from the "Owned documents" tab', () => { - cy.visit('/docs'); - cy.get('[data-testid="header-tab-1"]').click(); - cy.get('[value="techdocs-e2e-fixture"] > div > a').click(); - - cy.location().should(loc => { - expect(loc.pathname).to.eq( - '/docs/default/Component/techdocs-e2e-fixture', - ); - }); - }); - it('should navigate to a specific TechDocs entity page from a URL', () => { cy.visit('/docs/default/Component/techdocs-e2e-fixture'); cy.waitHomePage(); @@ -85,7 +78,7 @@ describe('TechDocs', () => { cy.window().its('scrollY').should('equal', 0); cy.getTechDocsShadowRoot().within(() => { - cy.contains('Subpage 2'); + cy.contains('Sub-page 2'); }); }); @@ -98,14 +91,8 @@ describe('TechDocs', () => { // This is used to test the post-render behavior of the techdocs Reader cy.wait(500); - return cy.getTechDocsShadowRoot().within(() => { - cy.get('#section-23').then($el => { - cy.window() - .its('scrollY') - .should($scrollY => { - expect($scrollY).to.be.closeTo($el[0].offsetTop, 200); - }); - }); + cy.getTechDocsShadowRoot().within(() => { + cy.isInViewport('#section-23'); }); }); @@ -125,7 +112,7 @@ describe('TechDocs', () => { cy.getTechDocsNavigation() .find('> div > div > [data-md-level="0"] > ul > li:nth-child(2) > a') .click(); - cy.contains('Subpage 1'); + cy.contains('Sub-page 1'); cy.window().its('scrollY').should('eq', 0); }); }); @@ -142,18 +129,13 @@ describe('TechDocs', () => { cy.get('> div > div > nav > ul > li:nth-child(3) > a').click(); }); - cy.get('#section-23').then($el => { - cy.window() - .its('scrollY') - .should($scrollY => { - expect($scrollY).to.be.closeTo($el[0].offsetTop, 200); - }); - }); + cy.isInViewport('#section-23'); }); }); it('should navigate to a specific fragment within the page via the table of contents - Level 2', () => { return cy.getTechDocsShadowRoot().within(() => { + cy.isNotInViewport('#sub-section-222'); // Section 2.2 cy.getTechDocsTableOfContents() .find( @@ -161,13 +143,7 @@ describe('TechDocs', () => { ) .click(); - cy.get('#sub-section-222').then($el => { - cy.window() - .its('scrollY') - .should($scrollY => { - expect($scrollY).to.be.closeTo($el[0].offsetTop, 200); - }); - }); + cy.isInViewport('#sub-section-222'); }); }); @@ -187,8 +163,6 @@ describe('TechDocs', () => { }); it('should navigate to the next page within a TechDocs entity', () => { - cy.scrollTo('bottom'); - return cy.getTechDocsShadowRoot().within(() => { cy.get('.md-footer-nav__link--next').click(); @@ -201,8 +175,6 @@ describe('TechDocs', () => { }); it('should navigate to the previous page within a TechDocs entity', () => { - cy.scrollTo('bottom'); - return cy.getTechDocsShadowRoot().within(() => { cy.get('.md-footer-nav__link--prev').click(); diff --git a/cypress/src/support/commands.ts b/cypress/src/support/commands.ts index 21a5235186..fba80e6d11 100644 --- a/cypress/src/support/commands.ts +++ b/cypress/src/support/commands.ts @@ -13,6 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +/* eslint-disable jest/no-standalone-expect */ /// import 'os'; @@ -24,6 +25,34 @@ Cypress.Commands.add('getTechDocsShadowRoot', () => { cy.get('[data-testid="techdocs-content-shadowroot"]').shadow(); }); +Cypress.Commands.add('isNotInViewport', element => { + cy.get(element).then($el => { + const bottom = Cypress.config(`viewportHeight`); + const rect = $el[0].getBoundingClientRect(); + + if (bottom) { + expect(rect.top).to.be.greaterThan(bottom); + expect(rect.bottom).to.be.greaterThan(bottom); + expect(rect.top).to.be.greaterThan(bottom); + expect(rect.bottom).to.be.greaterThan(bottom); + } + }); +}); + +Cypress.Commands.add('isInViewport', element => { + cy.get(element).then($el => { + const bottom = Cypress.config(`viewportHeight`); + const rect = $el[0].getBoundingClientRect(); + + if (bottom) { + expect(rect.top).not.to.be.greaterThan(bottom); + expect(rect.bottom).not.to.be.greaterThan(bottom); + expect(rect.top).not.to.be.greaterThan(bottom); + expect(rect.bottom).not.to.be.greaterThan(bottom); + } + }); +}); + Cypress.Commands.add('getTechDocsTableOfContents', () => { cy.get('[data-md-component="toc"]'); }); diff --git a/cypress/src/types.d.ts b/cypress/src/types.d.ts index f458ea83f4..4d1bf65715 100644 --- a/cypress/src/types.d.ts +++ b/cypress/src/types.d.ts @@ -64,8 +64,18 @@ declare namespace Cypress { waitHomePage(): Chainable; /** * Wait TechDocs API response for Section 2 page - * @example cy.waitRoadmapPage + * @example cy.waitSectionTwoPage */ waitSectionTwoPage(): Chainable; + /** + * Check if the element is in viewport + * @example cy.isInViewport + */ + isInViewport(element: string): Chainable; + /** + * Check if the element is not in viewport + * @example cy.isNotInViewport + */ + isNotInViewport(element: string): Chainable; } } diff --git a/yarn.lock b/yarn.lock index 9b1e1353ce..fd4eae94ae 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10621,10 +10621,10 @@ cypress@^7.3.0: blob-util "^2.0.2" bluebird "^3.7.2" cachedir "^2.3.0" - chalk "^2.4.2" + chalk "^4.1.0" check-more-types "^2.24.0" - cli-table3 "~0.5.1" - commander "^4.1.1" + cli-table3 "~0.6.0" + commander "^5.1.0" common-tags "^1.8.0" dayjs "^1.10.4" debug "4.3.2" @@ -17500,13 +17500,6 @@ log-symbols@^1.0.2: dependencies: chalk "^1.0.0" -log-symbols@^3.0.0: - version "3.0.0" - resolved "https://registry.npmjs.org/log-symbols/-/log-symbols-3.0.0.tgz#f3a08516a5dea893336a7dee14d18a1cfdab77c4" - integrity sha512-dSkNGuI7iG3mfvDzUuYZyvk5dD9ocYCYzNU6CYDE6+Xqd+gwme6Z00NS3dUh8mq/73HaEtT7m6W+yUPtU6BZnQ== - dependencies: - chalk "^2.4.2" - log-symbols@^4.0.0, log-symbols@^4.1.0: version "4.1.0" resolved "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz#3fbdbb95b4683ac9fc785111e792e558d4abd503" @@ -21231,11 +21224,16 @@ ramda@^0.21.0: resolved "https://registry.npmjs.org/ramda/-/ramda-0.21.0.tgz#a001abedb3ff61077d4ff1d577d44de77e8d0a35" integrity sha1-oAGr7bP/YQd9T/HVd9RN536NCjU= -ramda@^0.26, ramda@~0.26.1: +ramda@^0.26: version "0.26.1" resolved "https://registry.npmjs.org/ramda/-/ramda-0.26.1.tgz#8d41351eb8111c55353617fc3bbffad8e4d35d06" integrity sha512-hLWjpy7EnsDBb0p+Z3B7rPi3GDeRG5ZtiI33kJhTt+ORCd38AbAIjB/9zRIUoeTbE/AVX5ZkU7m6bznsvrf8eQ== +ramda@~0.27.1: + version "0.27.1" + resolved "https://registry.npmjs.org/ramda/-/ramda-0.27.1.tgz#66fc2df3ef873874ffc2da6aa8984658abacf5c9" + integrity sha512-PgIdVpn5y5Yns8vqb8FzBUEYn98V3xcPgawAkkgj0YJ0qDsnHCiNmZYfOGMgOvoB0eWFLpYbhxUR3mxfDIMvpw== + random-bytes@~1.0.0: version "1.0.0" resolved "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz#4f68a1dc0ae58bd3fb95848c30324db75d64360b" @@ -24734,20 +24732,13 @@ tmp@^0.0.33: dependencies: os-tmpdir "~1.0.2" -tmp@^0.2.0: +tmp@^0.2.0, tmp@~0.2.1: version "0.2.1" resolved "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz#8457fc3037dcf4719c251367a1af6500ee1ccf14" integrity sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ== dependencies: rimraf "^3.0.0" -tmp@~0.1.0: - version "0.1.0" - resolved "https://registry.npmjs.org/tmp/-/tmp-0.1.0.tgz#ee434a4e22543082e294ba6201dcc6eafefa2877" - integrity sha512-J7Z2K08jbGcdA1kkQpJSqLF6T0tdQqpR2pnSUXsIchbPdTI9v3e85cLW0d6WDhwuAleOV71j2xWs8qMPfK7nKw== - dependencies: - rimraf "^2.6.3" - tmpl@1.0.x: version "1.0.4" resolved "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz#23640dd7b42d00433911140820e5cf440e521dd1"