Merge pull request #4433 from matrix-org/travis/fix-e2e-tests

Turn the end-to-end tests back on and fix the lazy-loading tests

package.json

@@ -51,8 +51,7 @@
     "lint:types": "tsc --noEmit --jsx react",
     "lint:style": "stylelint 'res/css/**/*.scss'",
     "test": "jest",
-    "test:e2e": "echo 'The tests are broken with cross-signing. Fix them: https://github.com/vector-im/riot-web/issues/13226'",
+    "test:e2e": "./test/end-to-end-tests/run.sh --riot-url http://localhost:8080"
-    "test:e2e_real": "./test/end-to-end-tests/run.sh --riot-url http://localhost:8080"
   },
   "dependencies": {
     "@babel/runtime": "^7.8.3",

scripts/ci/end-to-end-tests.sh

@@ -13,29 +13,24 @@ handle_error() {
 
 trap 'handle_error' ERR
 
-echo "Tests are disabled, see https://github.com/vector-im/riot-web/issues/13226"
+echo "--- Building Riot"
-exit 0
+scripts/ci/layered-riot-web.sh
-
+cd ../riot-web
-#TODO: Uncomment all of this in https://github.com/vector-im/riot-web/issues/13226
+riot_web_dir=`pwd`
-
+CI_PACKAGE=true yarn build
-#echo "--- Building Riot"
+cd ../matrix-react-sdk
-#scripts/ci/layered-riot-web.sh
+# run end to end tests
-#cd ../riot-web
+pushd test/end-to-end-tests
-#riot_web_dir=`pwd`
+ln -s $riot_web_dir riot/riot-web
-#CI_PACKAGE=true yarn build
+# PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true ./install.sh
-#cd ../matrix-react-sdk
+# CHROME_PATH=$(which google-chrome-stable) ./run.sh
-## run end to end tests
+echo "--- Install synapse & other dependencies"
-#pushd test/end-to-end-tests
+./install.sh
-#ln -s $riot_web_dir riot/riot-web
+# install static webserver to server symlinked local copy of riot
-## PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true ./install.sh
+./riot/install-webserver.sh
-## CHROME_PATH=$(which google-chrome-stable) ./run.sh
+rm -r logs || true
-#echo "--- Install synapse & other dependencies"
+mkdir logs
-#./install.sh
+echo "+++ Running end-to-end tests"
-## install static webserver to server symlinked local copy of riot
+TESTS_STARTED=1
-#./riot/install-webserver.sh
+./run.sh --no-sandbox --log-directory logs/
-#rm -r logs || true
+popd
-#mkdir logs
-#echo "+++ Running end-to-end tests"
-#TESTS_STARTED=1
-#./run.sh --no-sandbox --log-directory logs/
-#popd

src/components/views/dialogs/CreateRoomDialog.js

@@ -194,7 +194,12 @@ export default createReactClass({
         let e2eeSection;
         if (!this.state.isPublic && SettingsStore.getValue("feature_cross_signing")) {
             e2eeSection = <React.Fragment>
-                <LabelledToggleSwitch label={ _t("Enable end-to-end encryption")} onChange={this.onEncryptedChange} value={this.state.isEncrypted} />
+                <LabelledToggleSwitch
+                    label={ _t("Enable end-to-end encryption")}
+                    onChange={this.onEncryptedChange}
+                    value={this.state.isEncrypted}
+                    className='mx_CreateRoomDialog_e2eSwitch' // for end-to-end tests
+                />
                 <p>{ _t("You can’t disable this later. Bridges & most bots won’t work yet.") }</p>
             </React.Fragment>;
         }

src/components/views/elements/LabelledToggleSwitch.js

@@ -35,6 +35,9 @@ export default class LabelledToggleSwitch extends React.Component {
         // True to put the toggle in front of the label
         // Default false.
         toggleInFront: PropTypes.bool,
+
+        // Additional class names to append to the switch. Optional.
+        className: PropTypes.string,
     };
 
     render() {
@@ -50,8 +53,9 @@ export default class LabelledToggleSwitch extends React.Component {
             secondPart = temp;
         }
 
+        const classes = `mx_SettingsFlag ${this.props.className || ""}`;
         return (
-            <div className="mx_SettingsFlag">
+            <div className={classes}>
                 {firstPart}
                 {secondPart}
             </div>

test/end-to-end-tests/src/usecases/create-room.js

@@ -20,7 +20,7 @@ async function openRoomDirectory(session) {
     await roomDirectoryButton.click();
 }
 
-async function createRoom(session, roomName) {
+async function createRoom(session, roomName, encrypted=false) {
     session.log.step(`creates room "${roomName}"`);
 
     const roomListHeaders = await session.queryAll('.mx_RoomSubList_labelContainer');
@@ -33,10 +33,14 @@ async function createRoom(session, roomName) {
     const addRoomButton = await roomsHeader.$(".mx_RoomSubList_addRoom");
     await addRoomButton.click();
 
-
     const roomNameInput = await session.query('.mx_CreateRoomDialog_name input');
     await session.replaceInputText(roomNameInput, roomName);
 
+    if (!encrypted) {
+        const encryptionToggle = await session.query('.mx_CreateRoomDialog_e2eSwitch .mx_ToggleSwitch');
+        await encryptionToggle.click();
+    }
+
     const createButton = await session.query('.mx_Dialog_primary');
     await createButton.click();