From 566a1a208cb51d193fd1838a4c35ab872a729fe7 Mon Sep 17 00:00:00 2001 From: Zach Bloomquist Date: Mon, 12 Sep 2022 21:56:13 -0400 Subject: [PATCH] feat: gate WebKit behind experimentalWebKitSupport in prod (#23711) --- circle.yml | 10 ++- cli/types/cypress.d.ts | 7 +- packages/app/src/main.ts | 2 +- packages/app/src/runner/index.ts | 17 ++--- .../config/__snapshots__/index.spec.ts.js | 3 + packages/config/src/options.ts | 6 ++ packages/config/test/project/utils.spec.ts | 2 + .../src/data/ProjectConfigManager.ts | 18 +++-- .../src/data/ProjectLifecycleManager.ts | 2 + packages/driver/cypress.config.ts | 19 +++--- .../cypress/e2e/cypress/proxy-logging.cy.ts | 3 +- packages/driver/cypress/e2e/webkit.cy.ts | 31 +++++++++ .../driver/src/cy/commands/origin/index.ts | 4 ++ .../driver/src/cy/commands/sessions/index.ts | 4 ++ .../cy/net-stubbing/static-response-utils.ts | 4 ++ packages/driver/src/cypress/error_messages.ts | 6 ++ packages/driver/src/cypress/script_utils.ts | 6 +- .../driver/src/cypress/source_map_utils.ts | 13 ++-- .../CHROME_WEB_SECURITY_NOT_SUPPORTED.html | 4 +- packages/errors/src/errors.ts | 2 +- .../cypress/e2e/e2ePluginSetup.ts | 1 + .../cypress/fixtures/config.json | 8 ++- .../frontend-shared/src/locales/en-US.json | 4 ++ packages/graphql/schemas/schema.graphql | 2 +- .../schemaTypes/objectTypes/gql-Browser.ts | 4 +- .../launchpad/src/setup/OpenBrowserList.vue | 7 +- packages/server/index.js | 2 +- packages/server/lib/browsers/index.ts | 12 +--- packages/server/lib/browsers/utils.ts | 23 +++---- packages/server/lib/browsers/webkit.ts | 65 +++++++++++++++---- packages/server/lib/experiments.ts | 2 + packages/server/lib/modes/run.ts | 2 +- packages/server/lib/open_project.ts | 3 +- packages/server/lib/project-base.ts | 2 +- packages/server/lib/server-base.ts | 7 +- packages/server/lib/socket-base.ts | 14 +++- packages/server/lib/unhandled_exceptions.js | 9 --- packages/server/lib/unhandled_exceptions.ts | 26 ++++++++ packages/server/lib/util/print-run.ts | 2 +- packages/server/test/unit/config_spec.js | 2 + packages/server/test/unit/project_spec.js | 2 +- packages/server/test/unit/socket_spec.js | 5 ++ .../test/unit/unhandled_exceptions_spec.js | 3 + packages/server/test/unit/util/trash_spec.js | 15 ++++- packages/server/test/unit/util/tty_spec.js | 18 ----- packages/types/src/browser.ts | 8 +-- packages/types/src/config.ts | 2 +- packages/types/src/server.ts | 2 +- .../__snapshots__/web_security_spec.js | 2 +- system-tests/lib/system-tests.ts | 7 ++ system-tests/test/web_security_spec.js | 2 +- 51 files changed, 282 insertions(+), 144 deletions(-) create mode 100644 packages/driver/cypress/e2e/webkit.cy.ts delete mode 100644 packages/server/lib/unhandled_exceptions.js create mode 100644 packages/server/lib/unhandled_exceptions.ts diff --git a/circle.yml b/circle.yml index 47dacb99542b..475345d768c7 100644 --- a/circle.yml +++ b/circle.yml @@ -36,8 +36,7 @@ macWorkflowFilters: &darwin-workflow-filters when: or: - equal: [ develop, << pipeline.git.branch >> ] - - equal: [ 'correct-dashboard-results', << pipeline.git.branch >> ] - - equal: [ 'skip-or-fix-flaky-tests-2', << pipeline.git.branch >> ] + - equal: [ 'webkit-experimental', << pipeline.git.branch >> ] - matches: pattern: "-release$" value: << pipeline.git.branch >> @@ -46,7 +45,7 @@ linuxArm64WorkflowFilters: &linux-arm64-workflow-filters when: or: - equal: [ develop, << pipeline.git.branch >> ] - - equal: [ 'skip-or-fix-flaky-tests-2', << pipeline.git.branch >> ] + - equal: [ 'webkit-experimental', << pipeline.git.branch >> ] - matches: pattern: "-release$" value: << pipeline.git.branch >> @@ -66,8 +65,7 @@ windowsWorkflowFilters: &windows-workflow-filters or: - equal: [ develop, << pipeline.git.branch >> ] - equal: [ linux-arm64, << pipeline.git.branch >> ] - - equal: [ 'lmiller/fixing-flake-1', << pipeline.git.branch >> ] - - equal: [ 'skip-or-fix-flaky-tests-2', << pipeline.git.branch >> ] + - equal: [ 'webkit-experimental', << pipeline.git.branch >> ] - matches: pattern: "-release$" value: << pipeline.git.branch >> @@ -132,7 +130,7 @@ commands: - run: name: Check current branch to persist artifacts command: | - if [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "correct-dashboard-results" ]]; then + if [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "webkit-experimental" ]]; then echo "Not uploading artifacts or posting install comment for this branch." circleci-agent step halt fi diff --git a/cli/types/cypress.d.ts b/cli/types/cypress.d.ts index 0572d04f9b01..8906b3530738 100644 --- a/cli/types/cypress.d.ts +++ b/cli/types/cypress.d.ts @@ -82,7 +82,7 @@ declare namespace Cypress { type BrowserChannel = 'stable' | 'canary' | 'beta' | 'dev' | 'nightly' | string - type BrowserFamily = 'chromium' | 'firefox' + type BrowserFamily = 'chromium' | 'firefox' | 'webkit' /** * Describes a browser Cypress can control @@ -2883,6 +2883,11 @@ declare namespace Cypress { * @default false */ experimentalStudio: boolean + /** + * Adds support for testing in the WebKit browser engine used by Safari. See https://on.cypress.io/webkit-experiment for more information. + * @default false + */ + experimentalWebKitSupport: boolean /** * Number of times to retry a failed test. * If a number is set, tests will retry in both runMode and openMode. diff --git a/packages/app/src/main.ts b/packages/app/src/main.ts index 823e76761253..8b2063e54186 100644 --- a/packages/app/src/main.ts +++ b/packages/app/src/main.ts @@ -22,7 +22,7 @@ const app = createApp(App) const config = getRunnerConfigFromWindow() -const ws = createWebsocket(config.socketIoRoute) +const ws = createWebsocket(config) window.ws = ws diff --git a/packages/app/src/runner/index.ts b/packages/app/src/runner/index.ts index 9f7bd1c1d6b7..ad7ccf599662 100644 --- a/packages/app/src/runner/index.ts +++ b/packages/app/src/runner/index.ts @@ -30,18 +30,11 @@ import { useStudioStore } from '../store/studio-store' let _eventManager: EventManager | undefined -export function createWebsocket (socketIoRoute: string) { - const socketConfig = { - path: socketIoRoute, - transports: ['websocket'], - } - - const ws = client(socketConfig) - - ws.on('connect_error', () => { - // fall back to polling if websocket fails to connect (webkit) - // https://github.com/socketio/socket.io/discussions/3998#discussioncomment-972316 - ws.io.opts.transports = ['polling', 'websocket'] +export function createWebsocket (config: Cypress.Config) { + const ws = client({ + path: config.socketIoRoute, + // TODO(webkit): the websocket socket.io transport is busted in WebKit, need polling + transports: config.browser.family === 'webkit' ? ['polling'] : ['websocket'], }) ws.on('connect', () => { diff --git a/packages/config/__snapshots__/index.spec.ts.js b/packages/config/__snapshots__/index.spec.ts.js index 260e9ba18c67..0a367f0dbcc1 100644 --- a/packages/config/__snapshots__/index.spec.ts.js +++ b/packages/config/__snapshots__/index.spec.ts.js @@ -40,6 +40,7 @@ exports['config/src/index .getDefaultValues returns list of public config keys 1 "experimentalSourceRewriting": false, "experimentalSingleTabRunMode": false, "experimentalStudio": false, + "experimentalWebKitSupport": false, "fileServerFolder": "", "fixturesFolder": "cypress/fixtures", "excludeSpecPattern": "*.hot-update.js", @@ -123,6 +124,7 @@ exports['config/src/index .getDefaultValues returns list of public config keys f "experimentalSourceRewriting": false, "experimentalSingleTabRunMode": false, "experimentalStudio": false, + "experimentalWebKitSupport": false, "fileServerFolder": "", "fixturesFolder": "cypress/fixtures", "excludeSpecPattern": "*.hot-update.js", @@ -202,6 +204,7 @@ exports['config/src/index .getPublicConfigKeys returns list of public config key "experimentalSourceRewriting", "experimentalSingleTabRunMode", "experimentalStudio", + "experimentalWebKitSupport", "fileServerFolder", "fixturesFolder", "excludeSpecPattern", diff --git a/packages/config/src/options.ts b/packages/config/src/options.ts index 843fb6e4ac71..dd39341ae123 100644 --- a/packages/config/src/options.ts +++ b/packages/config/src/options.ts @@ -227,6 +227,12 @@ const driverConfigOptions: Array = [ validation: validate.isBoolean, isExperimental: true, requireRestartOnChange: 'browser', + }, { + name: 'experimentalWebKitSupport', + defaultValue: false, + validation: validate.isBoolean, + isExperimental: true, + requireRestartOnChange: 'server', }, { name: 'fileServerFolder', defaultValue: '', diff --git a/packages/config/test/project/utils.spec.ts b/packages/config/test/project/utils.spec.ts index 2af4ff0b36be..843b5069d358 100644 --- a/packages/config/test/project/utils.spec.ts +++ b/packages/config/test/project/utils.spec.ts @@ -1044,6 +1044,7 @@ describe('config/src/project/utils', () => { experimentalSingleTabRunMode: { value: false, from: 'default' }, experimentalStudio: { value: false, from: 'default' }, experimentalSourceRewriting: { value: false, from: 'default' }, + experimentalWebKitSupport: { value: false, from: 'default' }, fileServerFolder: { value: '', from: 'default' }, fixturesFolder: { value: 'cypress/fixtures', from: 'default' }, hosts: { value: null, from: 'default' }, @@ -1137,6 +1138,7 @@ describe('config/src/project/utils', () => { experimentalSingleTabRunMode: { value: false, from: 'default' }, experimentalStudio: { value: false, from: 'default' }, experimentalSourceRewriting: { value: false, from: 'default' }, + experimentalWebKitSupport: { value: false, from: 'default' }, env: { foo: { value: 'foo', diff --git a/packages/data-context/src/data/ProjectConfigManager.ts b/packages/data-context/src/data/ProjectConfigManager.ts index 2717bedc4fba..7b2bbe4e9b12 100644 --- a/packages/data-context/src/data/ProjectConfigManager.ts +++ b/packages/data-context/src/data/ProjectConfigManager.ts @@ -500,14 +500,22 @@ export class ProjectConfigManager { } fullConfig.browsers = fullConfig.browsers?.map((browser) => { - if (browser.family === 'chromium' || fullConfig.chromeWebSecurity) { - return browser + if (browser.family === 'webkit' && !fullConfig.experimentalWebKitSupport) { + return { + ...browser, + disabled: true, + warning: '`playwright-webkit` is installed and WebKit is detected, but `experimentalWebKitSupport` is not enabled in your Cypress config. Set it to `true` to use WebKit.', + } } - return { - ...browser, - warning: browser.warning || getError('CHROME_WEB_SECURITY_NOT_SUPPORTED', browser.name).message, + if (browser.family !== 'chromium' && fullConfig.chromeWebSecurity) { + return { + ...browser, + warning: browser.warning || getError('CHROME_WEB_SECURITY_NOT_SUPPORTED', browser.name).message, + } } + + return browser }) // If we have withBrowsers set to false, it means we're coming from the legacy config.get API diff --git a/packages/data-context/src/data/ProjectLifecycleManager.ts b/packages/data-context/src/data/ProjectLifecycleManager.ts index db8d09eca653..2dfdc3de732b 100644 --- a/packages/data-context/src/data/ProjectLifecycleManager.ts +++ b/packages/data-context/src/data/ProjectLifecycleManager.ts @@ -380,6 +380,8 @@ export class ProjectLifecycleManager { } private _setCurrentProject (projectRoot: string) { + process.chdir(projectRoot) + this._projectRoot = projectRoot this._initializedProject = undefined diff --git a/packages/driver/cypress.config.ts b/packages/driver/cypress.config.ts index 8bc50e15faff..c803aac6b845 100644 --- a/packages/driver/cypress.config.ts +++ b/packages/driver/cypress.config.ts @@ -1,22 +1,23 @@ import { defineConfig } from 'cypress' export default defineConfig({ - 'projectId': 'ypt4pf', - 'experimentalStudio': true, - 'hosts': { + projectId: 'ypt4pf', + experimentalStudio: true, + experimentalWebKitSupport: true, + hosts: { '*.foobar.com': '127.0.0.1', '*.barbaz.com': '127.0.0.1', '*.idp.com': '127.0.0.1', 'localalias': '127.0.0.1', }, - 'reporter': 'cypress-multi-reporters', - 'reporterOptions': { - 'configFile': '../../mocha-reporter-config.json', + reporter: 'cypress-multi-reporters', + reporterOptions: { + configFile: '../../mocha-reporter-config.json', }, - 'e2e': { - 'setupNodeEvents': (on, config) => { + e2e: { + setupNodeEvents: (on, config) => { return require('./cypress/plugins')(on, config) }, - 'baseUrl': 'http://localhost:3500', + baseUrl: 'http://localhost:3500', }, }) diff --git a/packages/driver/cypress/e2e/cypress/proxy-logging.cy.ts b/packages/driver/cypress/e2e/cypress/proxy-logging.cy.ts index 0d99501c4d57..7347de2433a8 100644 --- a/packages/driver/cypress/e2e/cypress/proxy-logging.cy.ts +++ b/packages/driver/cypress/e2e/cypress/proxy-logging.cy.ts @@ -321,7 +321,8 @@ describe('Proxy Logging', () => { }) }) - it('works with forceNetworkError', () => { + // TODO(webkit): fix forceNetworkError and unskip + it('works with forceNetworkError', { browser: '!webkit' }, () => { const logs: any[] = [] cy.on('log:added', (log) => { diff --git a/packages/driver/cypress/e2e/webkit.cy.ts b/packages/driver/cypress/e2e/webkit.cy.ts new file mode 100644 index 000000000000..36da5ab9c4d5 --- /dev/null +++ b/packages/driver/cypress/e2e/webkit.cy.ts @@ -0,0 +1,31 @@ +describe('WebKit-specific behavior', { browser: 'webkit' }, () => { + it('cy.origin() is disabled', (done) => { + cy.on('fail', (err) => { + expect(err.message).to.equal('`cy.origin()` is not currently supported in experimental WebKit.') + expect(err.docsUrl).to.equal('https://on.cypress.io/webkit-experiment') + done() + }) + + cy.origin('foo', () => {}) + }) + + it('cy.session() is disabled', (done) => { + cy.on('fail', (err) => { + expect(err.message).to.equal('`cy.session()` is not currently supported in experimental WebKit.') + expect(err.docsUrl).to.equal('https://on.cypress.io/webkit-experiment') + done() + }) + + cy.session('foo', () => {}) + }) + + it('cy.session() is disabled', (done) => { + cy.on('fail', (err) => { + expect(err.message).to.include('`forceNetworkError` was passed, but it is not currently supported in experimental WebKit.') + expect(err.docsUrl).to.equal('https://on.cypress.io/intercept') + done() + }) + + cy.intercept('http://foo.com', { forceNetworkError: true }) + }) +}) diff --git a/packages/driver/src/cy/commands/origin/index.ts b/packages/driver/src/cy/commands/origin/index.ts index 249ea7151118..c1dc1d350dcf 100644 --- a/packages/driver/src/cy/commands/origin/index.ts +++ b/packages/driver/src/cy/commands/origin/index.ts @@ -54,6 +54,10 @@ export default (Commands, Cypress: Cypress.Cypress, cy: Cypress.cy, state: State Commands.addAll({ origin (urlOrDomain: string, optionsOrFn: { args: T } | (() => {}), fn?: (args?: T) => {}) { + if (Cypress.isBrowser('webkit')) { + return $errUtils.throwErrByPath('webkit.origin') + } + const userInvocationStack = state('current').get('userInvocationStack') // store the invocation stack in the case that `cy.origin` errors diff --git a/packages/driver/src/cy/commands/sessions/index.ts b/packages/driver/src/cy/commands/sessions/index.ts index 17ecd772a5b7..d045eb0b7720 100644 --- a/packages/driver/src/cy/commands/sessions/index.ts +++ b/packages/driver/src/cy/commands/sessions/index.ts @@ -53,6 +53,10 @@ export default function (Commands, Cypress, cy) { Commands.addAll({ session (id, setup?: Function, options: { validate?: Function } = {}) { + if (Cypress.isBrowser('webkit')) { + return $errUtils.throwErrByPath('webkit.session') + } + throwIfNoSessionSupport() if (!id || !_.isString(id) && !_.isObject(id)) { diff --git a/packages/driver/src/cy/net-stubbing/static-response-utils.ts b/packages/driver/src/cy/net-stubbing/static-response-utils.ts index 962c07bb559b..6f0d2cdae7a4 100644 --- a/packages/driver/src/cy/net-stubbing/static-response-utils.ts +++ b/packages/driver/src/cy/net-stubbing/static-response-utils.ts @@ -24,6 +24,10 @@ export function validateStaticResponse (cmd: string, staticResponse: StaticRespo err('`forceNetworkError`, if passed, must be the only option in the StaticResponse.') } + if (forceNetworkError && Cypress.isBrowser('webkit')) { + err('`forceNetworkError` was passed, but it is not currently supported in experimental WebKit.') + } + if (body && fixture) { err('`body` and `fixture` cannot both be set, pick one.') } diff --git a/packages/driver/src/cypress/error_messages.ts b/packages/driver/src/cypress/error_messages.ts index a8bb7269b7ef..7602034fde8f 100644 --- a/packages/driver/src/cypress/error_messages.ts +++ b/packages/driver/src/cypress/error_messages.ts @@ -2297,6 +2297,12 @@ export default { }, }, + webkit: { + docsUrl: 'https://on.cypress.io/webkit-experiment', + origin: '`cy.origin()` is not currently supported in experimental WebKit.', + session: '`cy.session()` is not currently supported in experimental WebKit.', + }, + window: { iframe_doc_undefined: 'The remote iframe\'s document is `undefined`', iframe_undefined: 'The remote iframe is `undefined`', diff --git a/packages/driver/src/cypress/script_utils.ts b/packages/driver/src/cypress/script_utils.ts index 7af8b90d8a52..1d6f2ea9dee3 100644 --- a/packages/driver/src/cypress/script_utils.ts +++ b/packages/driver/src/cypress/script_utils.ts @@ -17,7 +17,11 @@ const extractSourceMap = ([script, contents]) => { const sourceMap = $sourceMapUtils.extractSourceMap(script, contents) return $sourceMapUtils.initializeSourceMapConsumer(script, sourceMap) - .return([script, contents]) + .catch((_err) => { + // if WebAssembly is missing, we can't consume source maps, but it shouldn't block Cy + // like in WebKit on Windows: https://github.com/microsoft/playwright/issues/2876 + }) + .then(() => [script, contents]) } const evalScripts = (specWindow, scripts: any = []) => { diff --git a/packages/driver/src/cypress/source_map_utils.ts b/packages/driver/src/cypress/source_map_utils.ts index 24adc14faf74..5b78e1ff3c5c 100644 --- a/packages/driver/src/cypress/source_map_utils.ts +++ b/packages/driver/src/cypress/source_map_utils.ts @@ -1,6 +1,5 @@ import _ from 'lodash' import { SourceMapConsumer } from 'source-map' -import Promise from 'bluebird' // @ts-ignore import mappingsWasm from 'source-map/lib/mappings.wasm' @@ -12,19 +11,19 @@ const regexDataUrl = /data:[^;\n]+(?:;charset=[^;\n]+)?;base64,([a-zA-Z0-9+/]+={ let sourceMapConsumers = {} -const initializeSourceMapConsumer = (file, sourceMap) => { - if (!sourceMap) return Promise.resolve(null) +const initializeSourceMapConsumer = async (file, sourceMap) => { + if (!sourceMap) return null // @ts-ignore SourceMapConsumer.initialize({ 'lib/mappings.wasm': mappingsWasm, }) - return Promise.resolve(new SourceMapConsumer(sourceMap)).then((consumer) => { - sourceMapConsumers[file.fullyQualifiedUrl] = consumer + const consumer = await new SourceMapConsumer(sourceMap) - return consumer - }) + sourceMapConsumers[file.fullyQualifiedUrl] = consumer + + return consumer } const extractSourceMap = (file, fileContents) => { diff --git a/packages/errors/__snapshot-html__/CHROME_WEB_SECURITY_NOT_SUPPORTED.html b/packages/errors/__snapshot-html__/CHROME_WEB_SECURITY_NOT_SUPPORTED.html index 78a59080d890..7d0a2e73f95d 100644 --- a/packages/errors/__snapshot-html__/CHROME_WEB_SECURITY_NOT_SUPPORTED.html +++ b/packages/errors/__snapshot-html__/CHROME_WEB_SECURITY_NOT_SUPPORTED.html @@ -34,7 +34,7 @@ - 
Your project has set the configuration option: chromeWebSecurity to false
+    
Your project has set the configuration option: `chromeWebSecurity` to `false`.
 
-This option will not have an effect in Firefox. Tests that rely on web security being disabled will not run as expected.
+This option will not have an effect in Firefox. Tests that rely on web security being disabled will not run as expected.
 

\ No newline at end of file
diff --git a/packages/errors/src/errors.ts b/packages/errors/src/errors.ts
index 2426db69c7c6..073cc28b012b 100644
--- a/packages/errors/src/errors.ts
+++ b/packages/errors/src/errors.ts
@@ -86,7 +86,7 @@ export const AllCypressErrors = {
   },
   CHROME_WEB_SECURITY_NOT_SUPPORTED: (browser: string) => {
     return errTemplate`\
-        Your project has set the configuration option: ${fmt.highlight(`chromeWebSecurity`)} to ${fmt.highlightTertiary(`false`)}
+        Your project has set the configuration option: \`chromeWebSecurity\` to \`false\`.
 
         This option will not have an effect in ${fmt.off(_.capitalize(browser))}. Tests that rely on web security being disabled will not run as expected.`
   },
diff --git a/packages/frontend-shared/cypress/e2e/e2ePluginSetup.ts b/packages/frontend-shared/cypress/e2e/e2ePluginSetup.ts
index c6b7285f75fe..093e1afe81a2 100644
--- a/packages/frontend-shared/cypress/e2e/e2ePluginSetup.ts
+++ b/packages/frontend-shared/cypress/e2e/e2ePluginSetup.ts
@@ -174,6 +174,7 @@ async function makeE2ETasks () {
      * Called before each test to do global setup/cleanup
      */
     async __internal__beforeEach () {
+      process.chdir(cachedCwd)
       testState = {}
       await DataContext.waitForActiveRequestsToFlush()
       await globalPubSub.emitThen('test:cleanup')
diff --git a/packages/frontend-shared/cypress/fixtures/config.json b/packages/frontend-shared/cypress/fixtures/config.json
index 19221291c299..0b4a5cdfdd07 100644
--- a/packages/frontend-shared/cypress/fixtures/config.json
+++ b/packages/frontend-shared/cypress/fixtures/config.json
@@ -43,8 +43,7 @@
         "displayName": "Electron",
         "version": "94.0.4606.81",
         "path": "",
-        "majorVersion": 94,
-        "info": "Electron is the default browser that comes with Cypress. This is the default browser that runs in headless mode. Selecting this browser is useful when debugging. The version number indicates the underlying Chromium version that Electron uses."
+        "majorVersion": 94
       }
     ],
     "from": "default",
@@ -103,6 +102,11 @@
     "from": "default",
     "field": "experimentalSessionAndOrigin"
   },
+  {
+    "value": false,
+    "from": "default",
+    "field": "experimentalWebKitSupport"
+  },
   {
     "value": "",
     "from": "default",
diff --git a/packages/frontend-shared/src/locales/en-US.json b/packages/frontend-shared/src/locales/en-US.json
index d93a9b32bd9b..1a08718492d1 100644
--- a/packages/frontend-shared/src/locales/en-US.json
+++ b/packages/frontend-shared/src/locales/en-US.json
@@ -507,6 +507,10 @@
       "experimentalStudio": {
         "name": "Studio",
         "description": "Generate and save commands directly to your test suite by interacting with your app as an end user would."
+      },
+      "experimentalWebKitSupport": {
+        "name": "WebKit Support",
+        "description": "Adds support for testing in the WebKit browser engine used by Safari. See https://on.cypress.io/webkit-experiment for more information."
       }
     },
     "device": {
diff --git a/packages/graphql/schemas/schema.graphql b/packages/graphql/schemas/schema.graphql
index 1cff35e34834..b8e33d8d28db 100644
--- a/packages/graphql/schemas/schema.graphql
+++ b/packages/graphql/schemas/schema.graphql
@@ -23,7 +23,7 @@ enum AuthStateNameEnum {
 """Container representing a browser"""
 type Browser implements Node {
   channel: String!
-  disabled: Boolean!
+  disabled: Boolean
   displayName: String!
   family: BrowserFamily!
 
diff --git a/packages/graphql/src/schemaTypes/objectTypes/gql-Browser.ts b/packages/graphql/src/schemaTypes/objectTypes/gql-Browser.ts
index 160d4c7b34cb..b4b67d0efc03 100644
--- a/packages/graphql/src/schemaTypes/objectTypes/gql-Browser.ts
+++ b/packages/graphql/src/schemaTypes/objectTypes/gql-Browser.ts
@@ -7,9 +7,7 @@ export const Browser = objectType({
   node: (obj, args, ctx) => ctx.browser.idForBrowser(obj),
   definition (t) {
     t.nonNull.string('channel')
-    t.nonNull.boolean('disabled', {
-      resolve: () => false,
-    })
+    t.boolean('disabled')
 
     t.nonNull.boolean('isSelected', {
       resolve: (source, args, ctx) => ctx.browser.isSelected(source),
diff --git a/packages/launchpad/src/setup/OpenBrowserList.vue b/packages/launchpad/src/setup/OpenBrowserList.vue
index e762af6c15a5..e7215d573d4e 100644
--- a/packages/launchpad/src/setup/OpenBrowserList.vue
+++ b/packages/launchpad/src/setup/OpenBrowserList.vue
@@ -27,7 +27,7 @@
           }"
         >