Update default preprocessor references from browserify to webpack (#3015)

Co-authored-by: Jennifer Shehane <[email protected]>

Author: chrisbreiding

source/_changelogs/1.1.2.md

@@ -11,9 +11,8 @@
 
 - {% url 'Added ESLint, Docker, and TypeScript to Plugins' plugins %}
 - {% url 'Added recipe for TypeScript with Browserify' recipes %}
-- {% url 'Added recipe for TypeScript with Webpack' recipes %}
+- {% url 'Added recipe for TypeScript with webpack' recipes %}
 - {% url 'Added recipe for Direct Controlling AngularJS' recipes %}
 - {% url 'Added recipe for E2E API Testing' recipes %}
 - {% url 'Added more video tutorials' tutorials %}
 - {% url 'Improved displaying list of Tutorials, Recipes, Applications, and Docker examples' recipes %}
-

source/api/plugins/preprocessors-api.md

@@ -14,34 +14,33 @@ We've created three preprocessors as examples for you to look at. These are full
 
 The code contains comments that explain how it utilizes the preprocessor API.
 
-* {% url 'Browserify Preprocessor' https://github.com/cypress-io/cypress-browserify-preprocessor %}
-* {% url 'webpack Preprocessor' https://github.com/cypress-io/cypress-webpack-preprocessor %}
-* {% url 'Watch Preprocessor' https://github.com/cypress-io/cypress-watch-preprocessor %}
+* {% url 'webpack preprocessor' https://github.com/cypress-io/cypress-webpack-preprocessor %}
+* {% url 'Browserify preprocessor' https://github.com/cypress-io/cypress-browserify-preprocessor %}
+* {% url 'Watch preprocessor' https://github.com/cypress-io/cypress-watch-preprocessor %}
 
 # Defaults
 
-By default, Cypress comes packaged with the **Browserify Preprocessor** already installed.
+By default, Cypress comes packaged with the **webpack preprocessor** already installed.
 
-The Browserify Preprocessor handles:
+The webpack preprocessor handles:
 
+- ES2015 and JSX via Babel
+- TypeScript
 - CoffeeScript `1.x.x`
-- ES2015 via Babel
-- JSX and CJSX
 - Watching and caching files
 
-The exact default configuration options {% url 'can be found here' https://github.com/cypress-io/cypress-browserify-preprocessor#browserifyoptions %}.
-
 {% note info %}
-Are you looking to change the **default options** for Browserify?
+Are you looking to change the **default options** for webpack?
 {% endnote %}
 
-Changing the Browserify options lets you:
+If you already use webpack in your project, you can pass in your webpack config as {% url 'shown here' https://github.com/cypress-io/cypress-webpack-preprocessor#options %}.
+
+If you don't use webpack in your project or would like to keep the majority of the default options, you can {% url 'modify the default options' https://github.com/cypress-io/cypress-webpack-preprocessor#modifying-default-options %}. Editing the options allows you to do things like:
 
 - Add your own Babel plugins
+- Modify options for TypeScript compilation
 - Add support for CoffeeScript `2.x.x`
 
-Please read this link in the {% url 'Browserify preprocessor' https://github.com/cypress-io/cypress-browserify-preprocessor#modifying-default-options %} repo for instructions on modifying these.
-
 # Usage
 
 To use a preprocessor, you should bind to the `file:preprocessor` event in your {% url "`pluginsFile`" configuration#Folders-Files %}:

source/faq/questions/using-cypress-faq.md

@@ -484,7 +484,7 @@ describe('Logo', () => {
 
 The code you write in Cypress is executed in the browser, so you can import or require JS modules, *but* only those that work in a browser.
 
-You can `require` or `import` them as you're accustomed to. We preprocess your spec files with `babel` and `browserify`.
+You can `require` or `import` them as you're accustomed to. We preprocess your spec files with webpack and Babel.
 
 We recommend utilizing one of the following to execute code outside of the browser. Furthermore, you can use your own Node version during code excecution by setting the {% url "`nodeVersion`" configuration#Node-version %} in your configuration.
 
@@ -545,7 +545,7 @@ Not at the moment. {% issue 587 "There is an open issue for this." %}
 
 Yes. You can customize how specs are processed by using one of our {% url 'preprocessor plugins' plugins %} or by {% url 'writing your own custom preprocessor' preprocessors-api %}.
 
-Typically you'd reuse your existing `babel` and `webpack` configurations.
+Typically you'd reuse your existing Babel and webpack configurations.
 
 ## {% fa fa-angle-right %} How does one determine what the latest version of Cypress is?
 
@@ -628,7 +628,7 @@ Also, check out our {% url 'Stubbing `console` Receipe' recipes#Stubbing-and-spy
 
 ## {% fa fa-angle-right %} How do I use special characters with `cy.get()`?
 
-Special characters like `/`, `.` are valid characters for ids {% url "according to the CSS spec" https://www.w3.org/TR/html50/dom.html#the-id-attribute %}. 
+Special characters like `/`, `.` are valid characters for ids {% url "according to the CSS spec" https://www.w3.org/TR/html50/dom.html#the-id-attribute %}.
 
 To test elements with those characters in ids, they need to be escaped with {% url "`CSS.escape`" https://developer.mozilla.org/en-US/docs/Web/API/CSS/escape %} or {% url "`Cypress.$.escapeSelector`" https://api.jquery.com/jQuery.escapeSelector/ %}.
 

source/guides/core-concepts/writing-and-organizing-tests.md

@@ -485,7 +485,7 @@ Set the {% url `watchForFileChanges` configuration#Global %} configuration prope
 The `watchForFileChanges` property is only in effect when running Cypress using {% url "`cypress open`" command-line#cypress-open %}.
 {% endnote %}
 
-The component responsible for the file-watching behavior in Cypress is the {% url 'Cypress Browserify Preprocessor' https://github.com/cypress-io/cypress-browserify-preprocessor %}. This is the default file-watcher packaged with Cypress.
+The component responsible for the file-watching behavior in Cypress is the {% url '`cypress-webpack-preprocessor`' https://github.com/cypress-io/cypress-webpack-preprocessor %}. This is the default file-watcher packaged with Cypress.
 
 If you need further control of the file-watching behavior you can configure this preprocessor explicitly: it exposes options that allow you to configure behavior such as _what_ is watched and the delay before emitting an "update" event after a change.
 

source/guides/tooling/plugins-guide.md

@@ -34,14 +34,15 @@ Check out our {% url 'Configuration API docs' configuration-api %} which describ
 
 ## Preprocessors
 
-The event `file:preprocessor` is used to customize how your test code is transpiled and sent to the browser. By default Cypress handles CoffeeScript and ES6 using `babel` and then uses `browserify` to package it for the browser.
+The event `file:preprocessor` is used to customize how your test code is transpiled and sent to the browser. By default, Cypress handles ES2105, TypeScript, and CoffeeScript, using webpack to package it for the browser.
 
 You can use the `file:preprocessor` event to do things like:
 
 - Add the latest ES* support.
 - Write your test code in ClojureScript.
-- Customize the `babel` settings to add your own plugins.
-- Swap out `browserify` for `webpack` or anything else.
+- Customize the Babel settings to add your own plugins.
+- Customize the options for compiling TypeScript.
+- Swap out webpack for Browserify or anything else.
 
 Check out our {% url 'File Preprocessor API docs' preprocessors-api %} which describe how to use this event.