Repository: oppia/oppia
File: core/tests/puppeteer-acceptance-tests/utilities/common/puppeteer-utils.ts (TypeScript)

Code before:
            `core/tests/test-modules-mappings/acceptance/${specName}.txt`
          );
          TestToModulesMatcher.registerPuppeteerBrowser(browser);
        }
        this.page = await browser.newPage();

        if (mobile) {
          // This is the default viewport and user agent settings for iPhone 6.
          await this.page.setViewport({
            width: 375,
            height: 667,
            deviceScaleFactor: 2,
            isMobile: true,
            hasTouch: true,
            isLandscape: false,
          });
          await this.page.setUserAgent(
            'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) ' +
              'AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 ' +
              'Mobile/15A372 Safari/604.1'
          );
        } else {
          this.page.setViewport({width: 1920, height: 1080});
        }

        // Enable Video Recording.To switch between modes dynamically, you can use a separate compose file (e.g., docker-compose.override.yml) with different settings.
        if (process.env.VIDEO_RECORDING_IS_ENABLED === '1') {
          const outputFileName =
            `${specName}-${new Date().toISOString()}.mp4`.replace(
              /[^a-z0-9.-]/gi,
              '_'
            );

          const outputDir = testConstants.TEST_VIDEO_DIR;
          if (!fs.existsSync(outputDir)) {
            fs.mkdirSync(outputDir, {recursive: true});
          }

          const config = {
            followNewTab: true,
            fps: 25,
            ffmpeg_Path: null,
            videoFrame: {
              width: 1920,
              height: 1080,
            },
            aspectRatio: '16:9',
            videoCrf: 18,
            videoCodec: 'libx264',
            videoPreset: 'medium',
            videoBitrate: 1000,

Review comment (suggestion):
Add space before "To".

Can you explain the second thing in more detail or omit it? What does "switch between modes dynamically" mean and where exactly do they put this file? (Also, IMO it might be better to file an issue for this on the wiki repo instead and describe in more detail what behaviour we want to document here -- devs probably won't really find it if it's buried here.)

Code after:
            `core/tests/test-modules-mappings/acceptance/${specName}.txt`
          );
          TestToModulesMatcher.registerPuppeteerBrowser(browser);
        }
        this.page = await browser.newPage();

        if (mobile) {
          // This is the default viewport and user agent settings for iPhone 6.
          await this.page.setViewport({
            width: 375,
            height: 667,
            deviceScaleFactor: 2,
            isMobile: true,
            hasTouch: true,
            isLandscape: false,
          });
          await this.page.setUserAgent(
            'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) ' +
              'AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 ' +
              'Mobile/15A372 Safari/604.1'
          );
        } else {
          this.page.setViewport({width: 1920, height: 1080});
        }

        // Enable Video Recording.
        if (process.env.VIDEO_RECORDING_IS_ENABLED === '1') {
          const outputFileName =
            `${specName}-${new Date().toISOString()}.mp4`.replace(
              /[^a-z0-9.-]/gi,
              '_'
            );

          const outputDir = testConstants.TEST_VIDEO_DIR;
          if (!fs.existsSync(outputDir)) {
            fs.mkdirSync(outputDir, {recursive: true});
          }

          const config = {
            followNewTab: true,
            fps: 25,
            ffmpeg_Path: null,
            // Below dimensions are of recorded video.
            videoFrame: {
              width: 1920,
              height: 1080,
            },
            aspectRatio: '16:9',
            videoCrf: 18,
            videoCodec: 'libx264',
            videoPreset: 'medium',