Fix some of the selectors used on the login form

- Allow setting the sandbox in the config file, and document it
- Enable the sandbox in the default Docker config
- Don't assign to a const when trying to set the sandbox flag

.dockerignore

@@ -8,3 +8,4 @@ registration.yaml
 *.pickle
 profiles
 node_modules
+**/*.sock

SETUP.md

@@ -113,20 +113,21 @@ These instructions describe how to run the bridge with Docker containers.
 
 ## Initial setup
 1. `cd` to the directory where you cloned this repository
-1. Build the image for the bridge module with `docker build . -t matrix-puppeteer-line`
+1. Ensure that the repository root and `puppet` directories are writable by UID/GID 1337. A coarse way to achieve this is with `chmod o+w . puppet`
+1. Extract the downloaded .crx/.zip of the LINE Chrome extension to `puppet/extension_files`
 1. `cd` to the `puppet` directory, and build the image for the Puppeteer module with `docker build . -t matrix-puppeteer-line-chrome`
-1. Create a new directory outside of the repository directory, and `cd` into it
-1. Extract the downloaded .crx/.zip of the LINE Chrome extension to this directory
 1. Run a container for the Puppeteer module for the first time, so it can create a config file for you: `docker run --rm -v $(pwd):/data:z matrix-puppeteer-line-chrome`
-1. Update the config to your liking, but leave the `"executable_path"` setting as-is (unless you need to use a version of Chrome/Chromium from the host or another container).
+1. Update the config to your liking, but leave the `"executable_path"` setting as-is (unless you need to use a version of Chrome/Chromium from the host or another container)
 1. Run the Puppeteer module with `docker run --restart unless-stopped -v $(pwd):/data:z matrix-puppeteer-line-chrome`
+1. Open a new shell, since the prior `docker run` command runs in the foreground (unless `-d` is used)
+1. `cd` to the repository root, and build the image for the bridge module with `docker build . -t matrix-puppeteer-line`
 1. Run a container for the bridge module for the first time, so it can create a config file for you: `docker run --rm -v $(pwd):/data:z matrix-puppeteer-line`
 1. Update the config to your liking. You'll at least need to change the homeserver settings, appservice address and permissions, as well as the socket connection to the Puppeteer module
-    * Note that the Puppeteer module's default config uses a unix socket at `/data/puppet.sock`
+    * Note that the Puppeteer module container's `/data/` directory is accessible in the bridge module's container at `/data/puppet/`
+    * Thus, if the Puppeteer module is configured to use a unix socket at `/data/<sock_name>`, the bridge module's config must set `puppeteer.connection.path: /data/puppet/<sockname>`
 1. Generate the appservice registration by running the container again, and update your homeserver configuration to accept it
 1. Run the bridge module with `docker run --restart unless-stopped -v $(pwd):/data:z matrix-puppeteer-line`
-
-Additionally, you should either add the bridge to the same Docker network as your homeserver and datapase with `--network=<name>`, or expose the correct port(s) with `-p <port>:<port>.` (A quick-and-dirty option is to use `--network="host"`.)
+    * Additionally, you should either add the bridge to the same Docker network as your homeserver and database with `--network=<name>` (when they are running in Docker), or expose the correct port(s) with `-p <port>:<port>` or `--network=host` (when they are running outside Docker).
 
 ## Upgrading
 Simply `git pull` or `git rebase` the latest changes, rerun all `docker build` commands, then run new containers for the freshly-built images.

optional-requirements.txt

@@ -4,7 +4,7 @@
 #/e2be
 python-olm>=3,<4
 pycryptodome>=3,<4
-unpaddedbase64>=1,<2
+unpaddedbase64>=1,<3
 
 #/metrics
-prometheus_client>=0.6,<0.11
+prometheus_client>=0.6,<0.18

puppet/Dockerfile

@@ -2,7 +2,7 @@ FROM node:16-alpine3.14
 
 ARG TARGETARCH=amd64
 
-RUN apk add --no-cache chromium xvfb-run xdotool
+RUN apk add --no-cache chromium xvfb-run xdotool gtk+3.0
 
 WORKDIR /opt/matrix-puppeteer-line/puppet
 

puppet/README.md

@@ -6,6 +6,9 @@ If `type` is `tcp`, `port` and `host` are the host/port where to listen.
 ### Executable path
 The `executable_path` specifies the path to the Chromium binary for Puppeteer to use. Leaving this setting blank will use the x86_64 Chromium installation bundled with Puppeteer. For other architectures, it is necessary to install a compatible version of Chromium (ideally via your distribution's package manager), and to set `executable_path` to the path of its binary (typically `/usr/bin/chromium`).
 
+### Sandbox
+Whether or not to pass the `--no-sandbox` flag to Chromium. May be required when running Chromium in a container.
+
 ### Profile directory
 The `profile_dir` specifies which directory to put Chromium user data directories.
 

puppet/example-config-docker.json

@@ -4,6 +4,7 @@
 		"path": "/data/puppet.sock"
 	},
 	"executable_path": "/usr/lib/chromium/chrome",
+	"no_sandbox": true,
 	"profile_dir": "./profiles",
 	"extension_dir": "/data/extension_files",
 	"cycle_delay": 5000,

puppet/example-config.json

@@ -4,6 +4,7 @@
 		"path": "/var/run/matrix-puppeteer-line/puppet.sock"
 	},
 	"executable_path": "",
+	"no_sandbox": false,
 	"profile_dir": "./profiles",
 	"extension_dir": "./extension_files",
 	"cycle_delay": 5000,

puppet/src/contentscript.js

@@ -1705,7 +1705,7 @@ class MautrixController {
 		this.emailAppearObserver = new MutationObserver(changes => {
 			for (const change of changes) {
 				for (const node of change.addedNodes) {
-					const emailArea = node.querySelector("#login_email_area")
+					const emailArea = node.querySelector("[class*='login_form_area']")
 					if (emailArea && !emailArea.classList.contains("MdNonDisp")) {
 						window.__mautrixSendEmailCredentials()
 						return

puppet/src/main.js

@@ -35,7 +35,7 @@ const configPath = args["--config"] || "config.json"
 console.log("[Main] Reading config from", configPath)
 const config = JSON.parse(fs.readFileSync(configPath).toString())
 MessagesPuppeteer.executablePath = args["--browser"] || config.executable_path || MessagesPuppeteer.executablePath
-MessagesPuppeteer.noSandbox = args["--no-sandbox"] || MessagesPuppeteer.noSandbox
+MessagesPuppeteer.noSandbox = args["--no-sandbox"] || config.no_sandbox || MessagesPuppeteer.noSandbox
 MessagesPuppeteer.profileDir = config.profile_dir || MessagesPuppeteer.profileDir
 MessagesPuppeteer.devtools = config.devtools || false
 MessagesPuppeteer.extensionDir = config.extension_dir || MessagesPuppeteer.extensionDir

puppet/src/puppet.js

@@ -82,7 +82,7 @@ export default class MessagesPuppeteer {
 			`--window-size=${MessagesPuppeteer.viewport.width},${MessagesPuppeteer.viewport.height+120}`,
 		]
 		if (MessagesPuppeteer.noSandbox) {
-			args = args.concat(`--no-sandbox`)
+			args.push(`--no-sandbox`)
 		}
 
 		this.browser = await puppeteer.launch({
@@ -210,7 +210,7 @@ export default class MessagesPuppeteer {
 		this.loginRunning = true
 		await this.page.bringToFront()
 
-		const loginContentArea = await this.page.waitForSelector("#login_content")
+		const loginContentArea = await this.page.waitForSelector("[class*='page_login']")
 
 		switch (login_type) {
 		case "qr": {
@@ -236,10 +236,7 @@ export default class MessagesPuppeteer {
 				return
 			}
 
-			const emailButton = await this.page.waitForSelector("#login_email_btn")
-			await emailButton.click()
-
-			await this.page.waitForSelector("#login_email_area", {visible: true})
+			await this.page.waitForSelector("[class*='login_form_area']", {visible: true})
 			this.login_email = login_data["email"]
 			this.login_password = login_data["password"]
 			await this._sendEmailCredentials()
@@ -1263,9 +1260,9 @@ export default class MessagesPuppeteer {
 
 	async _sendEmailCredentials() {
 		this.log("Inputting login credentials")
-		await this._enterText(await this.page.$("#line_login_email"), this.login_email)
-		await this._enterText(await this.page.$("#line_login_pwd"), this.login_password)
-		await this.page.click("button#login_btn")
+		await this._enterText(await this.page.$("input[name='email']"), this.login_email)
+		await this._enterText(await this.page.$("input[name='password']"), this.login_password)
+		await this.page.click("button[class*='button_login']")
 	}
 
 	_receiveQRChange(url) {

requirements.txt

@@ -1,10 +1,10 @@
-ruamel.yaml>=0.15.35,<0.18
+ruamel.yaml>=0.15.94,<0.18
 python-magic>=0.4,<0.5
 commonmark>=0.8,<0.10
 aiohttp>=3,<4
 yarl>=1,<2
 attrs>=19.1
-mautrix>=0.9.2,<0.10
-asyncpg>=0.20,<0.23
-pillow>=4,<9
+mautrix>=0.20.0,<0.21
+asyncpg>=0.20,<0.28
+pillow>=4,<10
 qrcode>=6,<7