diff --git a/.yarn/offline-mirror/prettier-2.0.5.tgz b/.yarn/offline-mirror/prettier-2.0.5.tgz
new file mode 100644
index 000000000000..077c8ea10a64
Binary files /dev/null and b/.yarn/offline-mirror/prettier-2.0.5.tgz differ
diff --git a/actions/add-review-labels/index.js b/actions/add-review-labels/index.js
index f2375260d61a..acf6eb83eaf2 100644
--- a/actions/add-review-labels/index.js
+++ b/actions/add-review-labels/index.js
@@ -81,7 +81,7 @@ async function run() {
     reviews.push(review);
   }
 
-  const approved = reviews.filter(review => {
+  const approved = reviews.filter((review) => {
     return review.state === 'APPROVED';
   });
 
@@ -93,7 +93,7 @@ async function run() {
   const needsReviewLabels = new Set([visualReviewLabel, contentReviewLabel]);
 
   if (approved.length > 0) {
-    const hasReadyLabel = pullRequest.labels.find(label => {
+    const hasReadyLabel = pullRequest.labels.find((label) => {
       return label.name === readyForReviewLabel;
     });
     if (hasReadyLabel) {
@@ -107,7 +107,7 @@ async function run() {
   }
 
   if (approved.length === 1) {
-    const hasAdditionalReviewLabel = pullRequest.labels.find(label => {
+    const hasAdditionalReviewLabel = pullRequest.labels.find((label) => {
       return label.name === additionalReviewLabel;
     });
     if (!hasAdditionalReviewLabel) {
@@ -122,7 +122,7 @@ async function run() {
   }
 
   if (approved.length >= 2) {
-    const hasAdditionalReviewLabel = pullRequest.labels.find(label => {
+    const hasAdditionalReviewLabel = pullRequest.labels.find((label) => {
       return label.name === additionalReviewLabel;
     });
     if (hasAdditionalReviewLabel) {
@@ -134,14 +134,14 @@ async function run() {
       });
     }
 
-    const allNeedsReviewLabels = pullRequest.labels.filter(label => {
+    const allNeedsReviewLabels = pullRequest.labels.filter((label) => {
       return needsReviewLabels.has(label.name);
     });
     if (allNeedsReviewLabels.length > 0) {
       return;
     }
 
-    const shouldAutoLabel = autoLabelUsers.find(user => {
+    const shouldAutoLabel = autoLabelUsers.find((user) => {
       return user === pullRequest.user.login;
     });
     if (shouldAutoLabel) {
@@ -156,7 +156,7 @@ async function run() {
   }
 }
 
-run().catch(error => {
+run().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/docs/guides/building-an-icon-library.md b/docs/guides/building-an-icon-library.md
index 0e604ac2eae9..cd0b060b4c9a 100644
--- a/docs/guides/building-an-icon-library.md
+++ b/docs/guides/building-an-icon-library.md
@@ -134,7 +134,7 @@ high-level, the pattern for this file matches:
 const path = require('path');
 const build = require('../src/build');
 
-build({ cwd: path.resolve(__dirname, '../') }).catch(error => {
+build({ cwd: path.resolve(__dirname, '../') }).catch((error) => {
   console.error(error);
 });
 ```
@@ -177,7 +177,7 @@ async function build({ cwd }) {
   await Promise.all(
     // `meta` is a map that provides a hash of information about the current
     // icon to build
-    meta.map(async info => {
+    meta.map(async (info) => {
       // Typically, implementations will have a way to create a source module
       // from a source file and use that to write to the ESM path.
       const source = createModuleFromInfo(info);
diff --git a/e2e/icons-handlebars/handlebars-test.js b/e2e/icons-handlebars/handlebars-test.js
index c41b39539355..d0d7ffcb5e8a 100644
--- a/e2e/icons-handlebars/handlebars-test.js
+++ b/e2e/icons-handlebars/handlebars-test.js
@@ -22,7 +22,7 @@ describe('icons-handlebars', () => {
     }).toThrow();
   });
 
-  test.each(Object.keys(CarbonIcons))('%s should compile', name => {
+  test.each(Object.keys(CarbonIcons))('%s should compile', (name) => {
     expect(() => {
       hbs.compile(`{{ carbon-icon "${name}" }}`)();
       hbs.compile(
diff --git a/package.json b/package.json
index 358235966df4..aaa4144c7f18 100644
--- a/package.json
+++ b/package.json
@@ -66,7 +66,7 @@
     "jest-junit": "^10.0.0",
     "lerna": "^3.20.2",
     "lint-staged": "^9.5.0",
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.5",
     "prettier-config-carbon": "^0.0.0",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
diff --git a/packages/bundler/bin/bundler.js b/packages/bundler/bin/bundler.js
index 3211648983ef..6643ee10b2d7 100755
--- a/packages/bundler/bin/bundler.js
+++ b/packages/bundler/bin/bundler.js
@@ -16,7 +16,7 @@
 // Makes the script crash on unhandled rejections instead of silently
 // ignoring them. In the future, promise rejections that are not handled will
 // terminate the Node.js process with a non-zero exit code.
-process.on('unhandledRejection', err => {
+process.on('unhandledRejection', (err) => {
   console.error(err);
 });
 
@@ -40,7 +40,7 @@ if (major < 8) {
 
 var bundler = require('../src/bundler');
 
-bundler(process).catch(error => {
+bundler(process).catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/bundler/src/bundler.js b/packages/bundler/src/bundler.js
index 72d03d1f4589..4bb0f8f95df5 100644
--- a/packages/bundler/src/bundler.js
+++ b/packages/bundler/src/bundler.js
@@ -62,7 +62,7 @@ async function bundler({ argv, cwd: getWorkingDirectory }) {
       'the directory to output inlined sass dependencies',
       'scss'
     )
-    .action(cmd =>
+    .action((cmd) =>
       inline(cleanArgs(cmd), {
         cwd,
       })
diff --git a/packages/bundler/src/bundlers/javascript.js b/packages/bundler/src/bundlers/javascript.js
index e2fc2efa6f7e..8d77ea407ce5 100644
--- a/packages/bundler/src/bundlers/javascript.js
+++ b/packages/bundler/src/bundlers/javascript.js
@@ -96,7 +96,7 @@ async function bundle(entrypoint, options) {
 }
 
 function formatGlobals(string) {
-  const mappings = string.split(',').map(mapping => {
+  const mappings = string.split(',').map((mapping) => {
     return mapping.split('=');
   });
   return mappings.reduce(
diff --git a/packages/bundler/src/commands/check.js b/packages/bundler/src/commands/check.js
index 424779881b22..ca44b7cbc07f 100644
--- a/packages/bundler/src/commands/check.js
+++ b/packages/bundler/src/commands/check.js
@@ -25,7 +25,7 @@ async function check(pattern, { ignore, cwd, list } = {}) {
   reporter.info(`Compiling ${files.length} files...`);
 
   const results = await Promise.all(
-    compile(files.map(file => path.join(cwd, file)))
+    compile(files.map((file) => path.join(cwd, file)))
   );
 
   const errors = results.reduce((acc, result) => {
@@ -37,7 +37,7 @@ async function check(pattern, { ignore, cwd, list } = {}) {
   }, []);
 
   if (errors.length > 0) {
-    errors.forEach(error => {
+    errors.forEach((error) => {
       const { formatted, file } = error;
       reporter.error(`Error compiling ${path.relative(cwd, file)}`);
       console.log(chalk.gray(formatted));
diff --git a/packages/bundler/src/commands/inline.js b/packages/bundler/src/commands/inline.js
index d0500cabad7c..fdc3d4368d1f 100644
--- a/packages/bundler/src/commands/inline.js
+++ b/packages/bundler/src/commands/inline.js
@@ -54,7 +54,7 @@ async function inlineSassDependencies(
   ];
   const inlinedDependencies = (
     await Promise.all(
-      allPossibleDependencies.map(async dependency => {
+      allPossibleDependencies.map(async (dependency) => {
         const modules = await findSassModule(dependency, cwd);
         if (modules) {
           const [scssFolder] = modules;
@@ -106,7 +106,7 @@ async function inlineSassDependencies(
     'gm'
   );
   await Promise.all(
-    paths.map(async file => {
+    paths.map(async (file) => {
       const relativeImportPath = path.relative(
         path.dirname(file.path),
         vendorFolder
diff --git a/packages/bundler/src/commands/measure.js b/packages/bundler/src/commands/measure.js
index 8c48147d634b..7f2ae263f794 100644
--- a/packages/bundler/src/commands/measure.js
+++ b/packages/bundler/src/commands/measure.js
@@ -32,7 +32,7 @@ async function measure(pattern, { cwd, output, ignore = [] }) {
   });
 
   const results = await Promise.all(
-    compile(files.map(file => path.join(cwd, file)))
+    compile(files.map((file) => path.join(cwd, file)))
   );
 
   const errors = results.reduce((acc, result) => {
@@ -45,7 +45,7 @@ async function measure(pattern, { cwd, output, ignore = [] }) {
   }, []);
 
   if (errors.length > 0) {
-    errors.forEach(error => {
+    errors.forEach((error) => {
       const { formatted, filepath } = error;
       reporter.error(`Error compiling ${path.relative(cwd, filepath)}`);
       console.log(chalk.gray(formatted));
@@ -113,12 +113,12 @@ function printResults(prevResults, results) {
   ];
 
   const table = new Table({
-    head: resultsHeaders.map(label => chalk.gray.yellow(label)),
+    head: resultsHeaders.map((label) => chalk.gray.yellow(label)),
   });
 
-  results.forEach(result => {
+  results.forEach((result) => {
     const prevResult =
-      prevResults.find(prevResult => {
+      prevResults.find((prevResult) => {
         return (
           prevResult.filename === result.filename &&
           prevResult.package === result.package
diff --git a/packages/bundler/src/tools/compile.js b/packages/bundler/src/tools/compile.js
index b7d91324d564..ebfe14ed94b7 100644
--- a/packages/bundler/src/tools/compile.js
+++ b/packages/bundler/src/tools/compile.js
@@ -15,8 +15,8 @@ const defaultOptions = {
 
 function compile(filepaths, options) {
   return filepaths.map(
-    filepath =>
-      new Promise(resolve => {
+    (filepath) =>
+      new Promise((resolve) => {
         sass.render(
           {
             file: filepath,
diff --git a/packages/bundler/src/tools/sassdoc.js b/packages/bundler/src/tools/sassdoc.js
index 1c0a29145d88..a385cc336b61 100644
--- a/packages/bundler/src/tools/sassdoc.js
+++ b/packages/bundler/src/tools/sassdoc.js
@@ -25,7 +25,7 @@ const prettierOptions = {
  * Custom slugify for markdown-toc to not include escaped emoji characters
  * @param {string} title - the anchor link
  */
-const slugify = title => {
+const slugify = (title) => {
   return [...toc.slugify(title)].reduce((acc, ch) => {
     if (ch.charCodeAt(0) > 255) {
       return acc;
@@ -45,10 +45,10 @@ async function createJson(sourceDir, config) {
   config = config || {};
 
   return sassdoc.parse(sourceDir, config).then(
-    data => {
+    (data) => {
       return data;
     },
-    err => {
+    (err) => {
       console.error(err);
     }
   );
@@ -161,7 +161,7 @@ $${item.context.name}: ${item.context.value};
     let paramStr = '';
 
     if (item.parameter) {
-      item.parameter.forEach(param => {
+      item.parameter.forEach((param) => {
         if (paramStr) paramStr += `, `;
         paramStr += `$${param.name}`;
         if (param.default) paramStr += `: ${param.default}`;
@@ -188,14 +188,15 @@ $${item.context.name}: ${item.context.value};
 | Name | Description | Type | Default value |
 | --- | --- | --- | --- |`;
 
-    item.parameter.forEach(param => {
+    item.parameter.forEach((param) => {
       const paramType = param.type
         ? `\`${param.type.replace(/\|/g, `\\|`)}\``
         : '—';
       const paramDefault = param.default ? `\`${param.default}\`` : '—';
 
-      const row = `\n| \`$${param.name}\` | ${param.description ||
-        '—'} | ${paramType} | ${paramDefault} |`;
+      const row = `\n| \`$${param.name}\` | ${
+        param.description || '—'
+      } | ${paramType} | ${paramDefault} |`;
 
       str += row;
     });
@@ -254,7 +255,7 @@ ${item.example[0].code}
   if (item.aliased) {
     let subbullets = '';
 
-    item.aliased.forEach(aliased => {
+    item.aliased.forEach((aliased) => {
       subbullets += `\n  - \`${aliased}\``;
     });
 
@@ -274,7 +275,7 @@ ${item.example[0].code}
   if (item.require && item.require.length) {
     let subbullets = '';
 
-    dedupeArray(item.require).forEach(requires => {
+    dedupeArray(item.require).forEach((requires) => {
       subbullets += `\n   - ${createAnchorLink(
         `${requires.name} [${requires.type}]`,
         createUniqueName(requires.name, requires.type)
@@ -290,7 +291,7 @@ ${item.example[0].code}
   if (item.usedBy && item.usedBy.length) {
     let subbullets = '';
 
-    dedupeArray(item.usedBy).forEach(usedBy => {
+    dedupeArray(item.usedBy).forEach((usedBy) => {
       subbullets += `\n   - ${createAnchorLink(
         `${usedBy.context.name} [${usedBy.context.type}]`,
         createUniqueName(usedBy.context.name, usedBy.context.type)
@@ -313,7 +314,7 @@ ${item.example[0].code}
   if (item.link && item.link.length) {
     let subbullets = '';
 
-    item.link.forEach(link => {
+    item.link.forEach((link) => {
       subbullets += `\n   - [${link.caption || 'Link'}](${link.url})`;
     });
 
@@ -333,7 +334,7 @@ ${item.example[0].code}
   if (metadata.length) {
     str += '\n';
 
-    metadata.forEach(meta => {
+    metadata.forEach((meta) => {
       str += `\n- **${meta.key}**: ${meta.value}`;
     });
   }
@@ -352,11 +353,11 @@ async function createMarkdown(sourceDir, config) {
   config = config || {};
 
   return sassdoc.parse(sourceDir, config).then(
-    data => {
+    (data) => {
       let markdownFile = '';
 
       const documentedItems = data.filter(
-        item => item.access === 'public' || item.access === 'private'
+        (item) => item.access === 'public' || item.access === 'private'
       );
 
       markdownFile += `# Sass API
@@ -372,7 +373,7 @@ async function createMarkdown(sourceDir, config) {
 
       let currentGroup = '';
 
-      documentedItems.forEach(item => {
+      documentedItems.forEach((item) => {
         const itemGroup = createGroupName(item.group);
 
         if (itemGroup !== currentGroup) {
@@ -388,7 +389,7 @@ async function createMarkdown(sourceDir, config) {
         prettierOptions
       );
     },
-    err => {
+    (err) => {
       console.error(err);
     }
   );
diff --git a/packages/cli/bin/carbon-cli.js b/packages/cli/bin/carbon-cli.js
index 2129a876b8dd..3601927ffd76 100755
--- a/packages/cli/bin/carbon-cli.js
+++ b/packages/cli/bin/carbon-cli.js
@@ -17,7 +17,7 @@
 // Makes the script crash on unhandled rejections instead of silently
 // ignoring them. In the future, promise rejections that are not handled will
 // terminate the Node.js process with a non-zero exit code.
-process.on('unhandledRejection', error => {
+process.on('unhandledRejection', (error) => {
   console.error(error);
 });
 
@@ -40,7 +40,7 @@ if (major < 8) {
 
 var main = require('../src/cli');
 
-main(process).catch(error => {
+main(process).catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/cli/package.json b/packages/cli/package.json
index 40ad5dba35c0..dd01807ca0ac 100644
--- a/packages/cli/package.json
+++ b/packages/cli/package.json
@@ -29,7 +29,7 @@
     "fast-glob": "^3.2.2",
     "fs-extra": "^8.0.1",
     "inquirer": "^6.4.1",
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.5",
     "prettier-config-carbon": "^0.0.0",
     "progress-estimator": "^0.2.2",
     "remark": "^10.0.1",
diff --git a/packages/cli/src/changelog.js b/packages/cli/src/changelog.js
index 271b3f2d65a8..dcd38e96cf14 100644
--- a/packages/cli/src/changelog.js
+++ b/packages/cli/src/changelog.js
@@ -38,7 +38,7 @@ const headerDenyList = new Set([
  */
 async function generate(packages, lastTag, latestTag) {
   const packageCommitsInRange = await Promise.all(
-    packages.map(pkg => getCommitsInRange(pkg, `${lastTag}...${latestTag}`))
+    packages.map((pkg) => getCommitsInRange(pkg, `${lastTag}...${latestTag}`))
   );
   const packageCommitsToInclude = packageCommitsInRange.filter(
     ({ commits }) => {
@@ -86,7 +86,7 @@ function getMarkdownSections(packages) {
     let section = `## \`${name}@${version}\`\n`;
 
     for (const { title, types } of sectionTypes) {
-      const commitsForSection = commits.filter(commit => {
+      const commitsForSection = commits.filter((commit) => {
         return types.includes(commit.info.type);
       });
 
@@ -161,7 +161,7 @@ async function getCommitsInRange(pkg, range) {
   }
 
   const commitsInFolder = await Promise.all(
-    stdout.split('\n').map(async commit => {
+    stdout.split('\n').map(async (commit) => {
       // The output from `git rev-list` follows the pattern: `HASH <header>`, so
       // we will need to trim the string to get the appropriate hash and text
       // values for `parse` to consume.
@@ -184,7 +184,7 @@ async function getCommitsInRange(pkg, range) {
   // CHANGELOG, namely when we cannot parse the commit info type or when the
   // commit header is in our deny list
   const commits = commitsInFolder
-    .filter(commit => {
+    .filter((commit) => {
       if (commit.info.type === null) {
         return false;
       }
@@ -195,7 +195,7 @@ async function getCommitsInRange(pkg, range) {
 
       return true;
     })
-    .filter(commit => {
+    .filter((commit) => {
       // Running into an issue with duplicate headers when viewing "commited by"
       // and "commited and authored by", as a result we'll keep a set of all
       // headers and exclude the commit if we've seen it already
diff --git a/packages/cli/src/commands/contribute/setup.js b/packages/cli/src/commands/contribute/setup.js
index bc928923500e..032d65468701 100644
--- a/packages/cli/src/commands/contribute/setup.js
+++ b/packages/cli/src/commands/contribute/setup.js
@@ -158,7 +158,7 @@ an issue over at:
 function indent(string, spaces = 2) {
   return string
     .split('\n')
-    .map(s => s.padStart(spaces + s.length, ' '))
+    .map((s) => s.padStart(spaces + s.length, ' '))
     .join('\n');
 }
 
diff --git a/packages/cli/src/commands/release.js b/packages/cli/src/commands/release.js
index 57c1d1c191c8..c3f6f194b71a 100644
--- a/packages/cli/src/commands/release.js
+++ b/packages/cli/src/commands/release.js
@@ -32,7 +32,7 @@ const types = [
 // Filter supported commit types per release bump
 const typesByReleaseBump = {
   minor: types,
-  patch: types.filter(type => type !== 'feat'),
+  patch: types.filter((type) => type !== 'feat'),
 };
 
 const logger = createLogger('release');
@@ -183,7 +183,7 @@ async function cherryPickCommitsFrom(commitRange, bump) {
 
     commits.push(result);
   }
-  const commitsToCherryPick = commits.filter(commit => {
+  const commitsToCherryPick = commits.filter((commit) => {
     return (
       typesByReleaseBump[bump].includes(commit.info.type) ||
       commit.info.type === 'manual'
diff --git a/packages/cli/src/commands/sync/npm.js b/packages/cli/src/commands/sync/npm.js
index ac10b31298d2..d891a2857bb2 100644
--- a/packages/cli/src/commands/sync/npm.js
+++ b/packages/cli/src/commands/sync/npm.js
@@ -25,7 +25,7 @@ function run({ packagePaths }) {
 
       if (await fs.pathExists(ignorePath)) {
         const ignoreFile = await fs.readFile(ignorePath, 'utf8');
-        const localIgnorePatterns = ignoreFile.split('\n').filter(pattern => {
+        const localIgnorePatterns = ignoreFile.split('\n').filter((pattern) => {
           return ignorePatterns.indexOf(pattern) === -1;
         });
 
diff --git a/packages/cli/src/commands/sync/package.js b/packages/cli/src/commands/sync/package.js
index d211ad384b13..4bd6bd4f29ab 100644
--- a/packages/cli/src/commands/sync/package.js
+++ b/packages/cli/src/commands/sync/package.js
@@ -85,7 +85,7 @@ function run({ packagePaths }) {
         }
 
         if (Array.isArray(packageJson.keywords)) {
-          const keywordsToAdd = DEFAULT_KEYWORDS.filter(keyword => {
+          const keywordsToAdd = DEFAULT_KEYWORDS.filter((keyword) => {
             return packageJson.keywords.indexOf(keyword) === -1;
           });
           if (keywordsToAdd.length > 0) {
diff --git a/packages/cli/src/commands/sync/readme.js b/packages/cli/src/commands/sync/readme.js
index cadc43cd0410..494eb7ee2b05 100644
--- a/packages/cli/src/commands/sync/readme.js
+++ b/packages/cli/src/commands/sync/readme.js
@@ -31,7 +31,7 @@ function run({ root, packagePaths }) {
 
   return Promise.all(
     packagePaths
-      .filter(pkg => !packageDenyList.has(pkg.packageJson.name))
+      .filter((pkg) => !packageDenyList.has(pkg.packageJson.name))
       .map(async ({ packagePath }) => {
         const README_PATH = path.join(packagePath, 'README.md');
         if (!(await fs.pathExists(README_PATH))) {
diff --git a/packages/cli/src/commands/sync/remark/remark-monorepo.js b/packages/cli/src/commands/sync/remark/remark-monorepo.js
index 694549b9d9be..525d48a0af13 100644
--- a/packages/cli/src/commands/sync/remark/remark-monorepo.js
+++ b/packages/cli/src/commands/sync/remark/remark-monorepo.js
@@ -193,7 +193,7 @@ async function createAPIDoc(name, docsDir) {
     return [];
   }
 
-  const docs = (await fs.readdir(docsDir)).filter(name => {
+  const docs = (await fs.readdir(docsDir)).filter((name) => {
     // Ignore dotfiles and json files
     return !(name[0] === '.' || name === 'sass.json');
   });
@@ -234,7 +234,7 @@ async function createAPIDoc(name, docsDir) {
       type: 'list',
       ordered: false,
       spread: false,
-      children: docs.map(doc => ({
+      children: docs.map((doc) => ({
         type: 'listItem',
         spread: false,
         checked: null,
@@ -249,8 +249,10 @@ async function createAPIDoc(name, docsDir) {
                 children: [
                   {
                     type: 'text',
-                    value: `${doc[0].toUpperCase() +
-                      doc.slice(1).replace(/\.[^/.]+$/, '')}`,
+                    value: `${
+                      doc[0].toUpperCase() +
+                      doc.slice(1).replace(/\.[^/.]+$/, '')
+                    }`,
                   },
                 ],
               },
@@ -268,7 +270,7 @@ async function createExamples(name, examplesDir) {
     return [];
   }
 
-  const examples = (await fs.readdir(examplesDir)).filter(name => {
+  const examples = (await fs.readdir(examplesDir)).filter((name) => {
     // Ignore dotfiles and special cases `codesandbox` and `storybook`
     return !(
       name[0] === '.' ||
@@ -314,7 +316,7 @@ async function createExamples(name, examplesDir) {
       type: 'list',
       ordered: false,
       spread: false,
-      children: examples.map(example => ({
+      children: examples.map((example) => ({
         type: 'listItem',
         spread: false,
         checked: null,
diff --git a/packages/cli/src/workspace.js b/packages/cli/src/workspace.js
index f5725fb41a2c..9575d909664e 100644
--- a/packages/cli/src/workspace.js
+++ b/packages/cli/src/workspace.js
@@ -16,9 +16,9 @@ const packageJson = require('../../../package.json');
 const WORKSPACE_ROOT = path.resolve(__dirname, '../../../');
 const packagePaths = glob
   .sync(
-    packageJson.workspaces.packages.map(pattern => `${pattern}/package.json`)
+    packageJson.workspaces.packages.map((pattern) => `${pattern}/package.json`)
   )
-  .map(match => {
+  .map((match) => {
     const packageJsonPath = path.join(WORKSPACE_ROOT, match);
     return {
       packageJsonPath,
@@ -56,11 +56,8 @@ async function getPackages() {
   return JSON.parse(
     // Clean-up output by stripping out `yarn` information related to the
     // command and how long it took to run
-    lernaListOutput
-      .split('\n')
-      .slice(2, -1)
-      .join('\n')
-  ).filter(pkg => !pkg.private);
+    lernaListOutput.split('\n').slice(2, -1).join('\n')
+  ).filter((pkg) => !pkg.private);
 }
 
 module.exports = {
diff --git a/packages/colors/src/rgb.js b/packages/colors/src/rgb.js
index 7e20788f821f..5e94859bc88d 100644
--- a/packages/colors/src/rgb.js
+++ b/packages/colors/src/rgb.js
@@ -16,6 +16,6 @@ export function rgba(hexcode, opacity) {
     hexcode.substring(1, 3),
     hexcode.substring(3, 5),
     hexcode.substring(5, 7),
-  ].map(string => parseInt(string, 16));
+  ].map((string) => parseInt(string, 16));
   return `rgba(${values[0]}, ${values[1]}, ${values[2]}, ${opacity})`;
 }
diff --git a/packages/colors/tasks/build.js b/packages/colors/tasks/build.js
index 40821fe9a27c..98e01b1dfa8f 100644
--- a/packages/colors/tasks/build.js
+++ b/packages/colors/tasks/build.js
@@ -72,9 +72,9 @@ async function build() {
     })
   );
   const colorMapProperties = t.SassMap({
-    properties: Object.keys(colors).flatMap(swatch => {
+    properties: Object.keys(colors).flatMap((swatch) => {
       const value = t.SassMap({
-        properties: Object.keys(colors[swatch]).map(grade => {
+        properties: Object.keys(colors[swatch]).map((grade) => {
           return t.SassMapProperty({
             key: t.Identifier(grade),
             value: t.SassColor(colors[swatch][grade]),
@@ -172,7 +172,7 @@ async function build() {
   ]);
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/components/demo/index.js b/packages/components/demo/index.js
index d7f3e215ed9b..858e9be73b1c 100644
--- a/packages/components/demo/index.js
+++ b/packages/components/demo/index.js
@@ -21,12 +21,12 @@ if (typeof module !== 'undefined' && module.hot) {
     }
     // Releases component instances of (old) component classes that have been replaced with new ones by HMR
     Object.keys(components)
-      .map(key => components[key])
-      .filter(component => typeof component.init === 'function')
-      .forEach(Clz => {
+      .map((key) => components[key])
+      .filter((component) => typeof component.init === 'function')
+      .forEach((Clz) => {
         forEach.call(
           document.body.querySelectorAll(Clz.options.selectorInit),
-          element => {
+          (element) => {
             const instance = Clz.components.get(element);
             if (instance) {
               instance.release();
diff --git a/packages/components/demo/js/components/CodeExample/CodeExample.js b/packages/components/demo/js/components/CodeExample/CodeExample.js
index 3c118db3129a..4b75169fcb3b 100644
--- a/packages/components/demo/js/components/CodeExample/CodeExample.js
+++ b/packages/components/demo/js/components/CodeExample/CodeExample.js
@@ -40,7 +40,7 @@ class CodeExample extends Component {
     });
   };
 
-  highlight = node => {
+  highlight = (node) => {
     if (node) {
       if (window.Prism) {
         window.Prism.highlightElement(node);
@@ -50,7 +50,7 @@ class CodeExample extends Component {
           window.Prism &&
           Array.prototype.every.call(
             node.childNodes,
-            childNode => childNode.nodeType === Node.TEXT_NODE
+            (childNode) => childNode.nodeType === Node.TEXT_NODE
           )
         ) {
           window.Prism.highlightElement(node, this.determineShowBtnState());
@@ -96,7 +96,7 @@ class CodeExample extends Component {
       <div className="code-example">
         <div
           className={codeExampleClass}
-          ref={ref => {
+          ref={(ref) => {
             this.codeBlock = ref;
           }}>
           <pre className="line-numbers">
diff --git a/packages/components/demo/js/components/CodePage/CodePage.js b/packages/components/demo/js/components/CodePage/CodePage.js
index ba1cda20d2e5..a2af830c9937 100644
--- a/packages/components/demo/js/components/CodePage/CodePage.js
+++ b/packages/components/demo/js/components/CodePage/CodePage.js
@@ -17,8 +17,8 @@ const CodePage = ({
   const useSingleVariant = !metadata.isCollection && subItems.length <= 1;
   /* eslint-disable react/no-danger */
   const componentContent = subItems
-    .filter(item => !item.isHidden)
-    .map(item => (
+    .filter((item) => !item.isHidden)
+    .map((item) => (
       <div key={item.id} className="component-variation">
         {!useSingleVariant && (
           <h2 className="component-variation__name">{item.label}</h2>
diff --git a/packages/components/demo/js/components/ComponentExample/ComponentExample.js b/packages/components/demo/js/components/ComponentExample/ComponentExample.js
index 90bdbfee8e60..10d016a5aef7 100644
--- a/packages/components/demo/js/components/ComponentExample/ComponentExample.js
+++ b/packages/components/demo/js/components/ComponentExample/ComponentExample.js
@@ -88,7 +88,7 @@ class ComponentExample extends Component {
    * Instantiate/release Carbon components as the container for the live demo HTML code is mounted/unmounted.
    * @param {HTMLElement} container The container where the live demo HTML code should be put into.
    */
-  _setContainer = container => {
+  _setContainer = (container) => {
     this._container = container;
   };
 
@@ -99,11 +99,11 @@ class ComponentExample extends Component {
     const container = this._container;
     if (container) {
       const componentClasses = Object.keys(components)
-        .map(key => components[key])
-        .filter(Clz => typeof Clz.init === 'function');
+        .map((key) => components[key])
+        .filter((Clz) => typeof Clz.init === 'function');
       componentClasses
-        .filter(Clz => !Clz.forLazyInit)
-        .forEach(Clz => {
+        .filter((Clz) => !Clz.forLazyInit)
+        .forEach((Clz) => {
           Clz.init(container);
         });
     }
@@ -116,12 +116,12 @@ class ComponentExample extends Component {
     const container = this._container;
     if (container) {
       Object.keys(components)
-        .map(key => components[key])
-        .filter(Clz => typeof Clz.init === 'function')
-        .forEach(Clz => {
+        .map((key) => components[key])
+        .filter((Clz) => typeof Clz.init === 'function')
+        .forEach((Clz) => {
           forEach.call(
             container.querySelectorAll(Clz.options.selectorInit),
-            element => {
+            (element) => {
               const instance = Clz.components.get(element);
               if (instance) {
                 instance.release();
diff --git a/packages/components/demo/js/components/RootPage.js b/packages/components/demo/js/components/RootPage.js
index 85f4df78685a..56d1270d2fa3 100644
--- a/packages/components/demo/js/components/RootPage.js
+++ b/packages/components/demo/js/components/RootPage.js
@@ -26,7 +26,7 @@ const themeSwitcherItems = [
   },
 ];
 
-const checkStatus = response => {
+const checkStatus = (response) => {
   if (response.status >= 200 && response.status < 400) {
     return response;
   }
@@ -40,10 +40,10 @@ const checkStatus = response => {
  * @param {Array<object>} componentItems List of Fractal Component instance data.
  * @returns {Array<object>} List of Fractal Component instance data with the contents of all components cleared.
  */
-const clearContent = componentItems =>
-  componentItems.map(item => ({
+const clearContent = (componentItems) =>
+  componentItems.map((item) => ({
     ...item,
-    items: item.items.map(subItem => ({
+    items: item.items.map((subItem) => ({
       ...subItem,
       renderedContent: undefined,
     })),
@@ -58,7 +58,7 @@ const clearContent = componentItems =>
  */
 const applyContent = (componentItems, id, content) => {
   if (Object(content) === content) {
-    return componentItems.map(item => {
+    return componentItems.map((item) => {
       if (item.id !== id) {
         return item;
       }
@@ -69,7 +69,7 @@ const applyContent = (componentItems, id, content) => {
           }
         : {
             ...item,
-            items: item.items.map(subItem =>
+            items: item.items.map((subItem) =>
               !content[subItem.handle]
                 ? subItem
                 : {
@@ -80,7 +80,7 @@ const applyContent = (componentItems, id, content) => {
           };
     });
   }
-  return componentItems.map(item =>
+  return componentItems.map((item) =>
     item.id !== id
       ? item
       : {
@@ -94,8 +94,8 @@ const applyContent = (componentItems, id, content) => {
  * @param {Array<object>} componentItems List of Fractal Component instance data.
  * @returns {Array<object>} The component data with `isHidden` moved to `meta.isDefaultHidden`.
  */
-const preserveDefaultHidden = componentItems =>
-  componentItems.map(item => {
+const preserveDefaultHidden = (componentItems) =>
+  componentItems.map((item) => {
     const { items: subItems, meta = {} } = item;
     return {
       ...item,
@@ -118,7 +118,7 @@ const preserveDefaultHidden = componentItems =>
  * @returns {Array<object>} The component data with `isHidden` calculated with `meta.isDefaultHidden` and `isComponentsX`.
  */
 const applyComponentsX = (componentItems, isComponentsX) =>
-  componentItems.map(item => {
+  componentItems.map((item) => {
     const { items: subItems, meta = {} } = item;
     return {
       ...item,
@@ -186,7 +186,7 @@ class RootPage extends Component {
 
   constructor() {
     super();
-    window.addEventListener('popstate', evt => {
+    window.addEventListener('popstate', (evt) => {
       this.switchTo(evt.state.name);
     });
   }
@@ -249,7 +249,7 @@ class RootPage extends Component {
       const name =
         nameInQueryArg || (pathnameTokens && pathnameTokens[1]) || '';
       const selectedNavItem =
-        (name && componentItems.find(item => item.name === name)) ||
+        (name && componentItems.find((item) => item.name === name)) ||
         componentItems[0];
       if (selectedNavItem) {
         this.switchTo(selectedNavItem.id);
@@ -280,13 +280,13 @@ class RootPage extends Component {
   /**
    * The handler for the `click` event on the side nav for changing selection.
    */
-  onSideNavItemClick = evt => {
+  onSideNavItemClick = (evt) => {
     const link = eventMatches(evt, '[data-nav-id]');
     if (link) {
       const { componentItems } = this.state;
       const selectedNavItem =
         componentItems &&
-        componentItems.find(item => item.id === link.dataset.navId);
+        componentItems.find((item) => item.id === link.dataset.navId);
       if (selectedNavItem) {
         this.switchTo(selectedNavItem.id);
       }
@@ -300,7 +300,7 @@ class RootPage extends Component {
     const { componentItems, selectedNavItemId } = this.state;
     return (
       componentItems &&
-      componentItems.find(item => item.id === selectedNavItemId)
+      componentItems.find((item) => item.id === selectedNavItemId)
     );
   }
 
@@ -309,7 +309,7 @@ class RootPage extends Component {
    * @param {object} evt The event.
    * @private
    */
-  _handleBrowserSyncEvent = evt => {
+  _handleBrowserSyncEvent = (evt) => {
     if (evt.basename === 'demo.css') {
       this._inspectLinkTag();
     }
@@ -320,7 +320,7 @@ class RootPage extends Component {
    * @param {object} evt The event.
    * @private
    */
-  _switchExperimental = evt => {
+  _switchExperimental = (evt) => {
     const { portSassBuild } = this.props;
     fetch(
       `http://localhost:${portSassBuild}/${
@@ -343,7 +343,7 @@ class RootPage extends Component {
     this.hStyleInspectionTimeout = setTimeout(() => {
       const links = Array.prototype.filter.call(
         document.querySelectorAll('link[type="text/css"]'),
-        link => /\/demo\.css/i.test(link.getAttribute('href'))
+        (link) => /\/demo\.css/i.test(link.getAttribute('href'))
       );
       const lastLink = links[links.length - 1];
       if (lastLink.sheet) {
@@ -363,17 +363,17 @@ class RootPage extends Component {
     const { componentItems, selectedNavItemId } = this.state;
     const metadata =
       componentItems &&
-      componentItems.find(item => item.id === selectedNavItemId);
+      componentItems.find((item) => item.id === selectedNavItemId);
     const subItems = metadata.items || [];
     const hasRenderedContent =
       !metadata.isCollection && subItems.length <= 1
         ? metadata.renderedContent
-        : subItems.every(item => item.renderedContent);
+        : subItems.every((item) => item.renderedContent);
     if (!hasRenderedContent) {
       fetch(`/code/${metadata.name}`)
         .then(checkStatus)
-        .then(response => response.json())
-        .then(responseContent => {
+        .then((response) => response.json())
+        .then((responseContent) => {
           // Re-evaluate `this.state.componentItems` as it may have been changed during loading contents
           this.setState(({ componentItems: prevComponentItems }) => ({
             componentItems: applyContent(
@@ -412,7 +412,7 @@ class RootPage extends Component {
     const { isComponentsX: oldIsComponentsX, componentItems } = this.state;
     const isComponentsX = Array.prototype.some.call(
       link.sheet.cssRules,
-      rule =>
+      (rule) =>
         /^\.bx--body$/.test(rule.selectorText) &&
         /^rgb\(255,\s*255,\s*255\)$/.test(
           rule.style.getPropertyValue('background-color')
@@ -440,7 +440,7 @@ class RootPage extends Component {
    */
   _handleChangeThemeSwitcherDropdown = ({ value }) => {
     this.setState({ currentTheme: value }, () => {
-      themeSwitcherItems.forEach(item => {
+      themeSwitcherItems.forEach((item) => {
         document.documentElement.classList.toggle(
           `demo--theme--${item.id}`,
           item.id === value
@@ -459,7 +459,7 @@ class RootPage extends Component {
       const { componentItems } = this.state;
       const selectedNavItem =
         componentItems &&
-        componentItems.find(item => item.id === selectedNavItemId);
+        componentItems.find((item) => item.id === selectedNavItemId);
       const { name } = selectedNavItem || {};
       if (name) {
         window.history.pushState(
@@ -513,7 +513,7 @@ class RootPage extends Component {
         <div className="demo--theme-switcher--dropdown">
           <Dropdown
             items={themeSwitcherItems}
-            itemToString={item => (item ? item.text : '')}
+            itemToString={(item) => (item ? item.text : '')}
             value={currentTheme}
             onChange={this._handleChangeThemeSwitcherDropdown}>
             {themeSwitcherItems.map(({ id, text }) => (
diff --git a/packages/components/demo/js/components/SideNav.js b/packages/components/demo/js/components/SideNav.js
index a6c697abb8ae..322c94bbf661 100644
--- a/packages/components/demo/js/components/SideNav.js
+++ b/packages/components/demo/js/components/SideNav.js
@@ -32,7 +32,7 @@ class SideNav extends Component {
     onItemClick: PropTypes.func,
   };
 
-  handleItemClick = evt => {
+  handleItemClick = (evt) => {
     const { onItemClick = () => {} } = this.props;
     onItemClick(evt);
     evt.preventDefault();
@@ -44,8 +44,8 @@ class SideNav extends Component {
       <UIShellSideNav className={className}>
         <SideNavItems>
           {items
-            .filter(item => !item.isHidden)
-            .map(item => {
+            .filter((item) => !item.isHidden)
+            .map((item) => {
               const { id, name, label } = item;
               return (
                 <SideNavLink
diff --git a/packages/components/demo/js/components/boot-nav.js b/packages/components/demo/js/components/boot-nav.js
index a3ea4192ec70..1e15f6cd0a20 100644
--- a/packages/components/demo/js/components/boot-nav.js
+++ b/packages/components/demo/js/components/boot-nav.js
@@ -9,10 +9,10 @@ import RootPage from './RootPage';
  * @param {Function} callback The callback.
  * @private
  */
-const pollForBrowserSync = callback => {
+const pollForBrowserSync = (callback) => {
   const bsScriptTag = Array.prototype.find.call(
     document.querySelectorAll('script'),
-    elem => /browser-sync-client/i.test(elem.src)
+    (elem) => /browser-sync-client/i.test(elem.src)
   );
   // eslint-disable-next-line no-underscore-dangle
   if (!bsScriptTag || window.___browserSync___) {
@@ -33,7 +33,7 @@ const normalizeComponentItem = ({ notes, variants, items = [], ...other }) => ({
   ...other,
   notes,
   items: (!variants || !variants.items ? items : variants.items).map(
-    subItem => ({
+    (subItem) => ({
       ...subItem,
       // Avoid using notes copied from component to variant
       notes: notes === subItem.notes ? undefined : subItem.notes,
diff --git a/packages/components/demo/js/file-uploader-demo-state-manager.js b/packages/components/demo/js/file-uploader-demo-state-manager.js
index 4d6c0e23bca8..2cddbcdce585 100644
--- a/packages/components/demo/js/file-uploader-demo-state-manager.js
+++ b/packages/components/demo/js/file-uploader-demo-state-manager.js
@@ -54,7 +54,7 @@ class FileUploaderDemoStateManager extends mixin(
    * Handles `change` event of the "upload" button.
    * @param {Event} evt The event.
    */
-  _handleChange = evt => {
+  _handleChange = (evt) => {
     const uploader = FileUplaoder.components.get(this.element);
     if (!uploader) {
       throw new TypeError('Cannot find the file uploader instance.');
@@ -72,12 +72,12 @@ class FileUploaderDemoStateManager extends mixin(
       console.log('Simulated uploading files...:', files);
 
       setTimeout(() => {
-        Array.prototype.forEach.call(files, file => {
+        Array.prototype.forEach.call(files, (file) => {
           uploader.setState('complete', this._files.indexOf(file));
         });
 
         setTimeout(() => {
-          Array.prototype.forEach.call(files, file => {
+          Array.prototype.forEach.call(files, (file) => {
             uploader.setState('edit', this._files.indexOf(file));
           });
         }, 500);
@@ -90,7 +90,7 @@ class FileUploaderDemoStateManager extends mixin(
    * @param {MouseEvent} evt The event.
    * @private
    */
-  _handleDrop = evt => {
+  _handleDrop = (evt) => {
     const uploader = FileUplaoder.components.get(this.element);
     if (!uploader) {
       throw new TypeError('Cannot find the file uploader instance.');
@@ -108,12 +108,12 @@ class FileUploaderDemoStateManager extends mixin(
       console.log('Simulated uploading files...:', files);
 
       setTimeout(() => {
-        Array.prototype.forEach.call(files, file => {
+        Array.prototype.forEach.call(files, (file) => {
           uploader.setState('complete', this._files.indexOf(file));
         });
 
         setTimeout(() => {
-          Array.prototype.forEach.call(files, file => {
+          Array.prototype.forEach.call(files, (file) => {
             uploader.setState('edit', this._files.indexOf(file));
           });
         }, 500);
@@ -125,7 +125,7 @@ class FileUploaderDemoStateManager extends mixin(
    * Handles the event of deleting uploaded file.
    * @param {CustomEvent} evt The event.
    */
-  _handleDelete = evt => {
+  _handleDelete = (evt) => {
     if (evt.type === 'fileuploader-before-delete-filename') {
       evt.detail.filenameIndex = Array.prototype.indexOf.call(
         this.element.querySelectorAll(this.options.selectorSelectedFile),
diff --git a/packages/components/demo/js/inline-loading-demo-button.js b/packages/components/demo/js/inline-loading-demo-button.js
index eba0116cd206..8ea064e02660 100644
--- a/packages/components/demo/js/inline-loading-demo-button.js
+++ b/packages/components/demo/js/inline-loading-demo-button.js
@@ -20,7 +20,7 @@ class InlineLoadingDemoButton extends mixin(
   constructor(element) {
     super(element);
     this.manage(
-      on(element, 'click', event => {
+      on(element, 'click', (event) => {
         this.toggle(event);
       })
     );
diff --git a/packages/components/demo/polyfills/element-matches.js b/packages/components/demo/polyfills/element-matches.js
index a4b7aaba5089..0d8566a806fc 100644
--- a/packages/components/demo/polyfills/element-matches.js
+++ b/packages/components/demo/polyfills/element-matches.js
@@ -2,7 +2,7 @@ const matchesFuncName = [
   'matches',
   'webkitMatchesSelector',
   'msMatchesSelector',
-].filter(name => typeof Element.prototype[name] === 'function')[0];
+].filter((name) => typeof Element.prototype[name] === 'function')[0];
 
 if (matchesFuncName !== 'matches') {
   Element.prototype.matches = Element.prototype[matchesFuncName];
diff --git a/packages/components/demo/polyfills/toggle-class.js b/packages/components/demo/polyfills/toggle-class.js
index c2de90a572cb..0c64f8facec3 100644
--- a/packages/components/demo/polyfills/toggle-class.js
+++ b/packages/components/demo/polyfills/toggle-class.js
@@ -1,8 +1,6 @@
 const missingNativeDOMTokenListToggleForce = (() => {
   const elem = document.createElement('div');
-  const randomClass = `_random_class_${Math.random()
-    .toString(36)
-    .slice(2)}`;
+  const randomClass = `_random_class_${Math.random().toString(36).slice(2)}`;
   elem.classList.toggle(randomClass, false);
   return elem.classList.contains(randomClass);
 })();
diff --git a/packages/components/gulpfile.js b/packages/components/gulpfile.js
index 342106dc8505..bf8e131b09bc 100644
--- a/packages/components/gulpfile.js
+++ b/packages/components/gulpfile.js
@@ -74,7 +74,7 @@ function getTemplates() {
   }
 }
 
-const assign = v => v;
+const assign = (v) => v;
 const cloptions = commander
   .option(
     '-b, --use-breaking-changes',
@@ -165,7 +165,7 @@ gulp.task('scripts:dev:feature-flags', () => {
     replaceTable.grid = useExperimentalFeatures;
   }
   return readFile(path.resolve(__dirname, 'src/globals/js/feature-flags.js'))
-    .then(contents =>
+    .then((contents) =>
       contents
         .toString()
         .replace(
@@ -176,7 +176,7 @@ gulp.task('scripts:dev:feature-flags', () => {
               : `${definition}${!!replaceTable[name]}`
         )
     )
-    .then(contents =>
+    .then((contents) =>
       writeFile(path.resolve(__dirname, 'demo/feature-flags.js'), contents)
     );
 });
@@ -190,7 +190,7 @@ const buildDemoJS = () => {
         process.env.NODE_ENV !== 'production' ? {} : rollupTerser(),
       ],
     })
-      .then(bundle =>
+      .then((bundle) =>
         bundle.write({
           format: 'iife',
           name: 'CarbonComponents',
@@ -205,7 +205,7 @@ const buildDemoJS = () => {
       });
   }
   const webpackDemoConfig = require('./tools/webpack-demo.config'); // eslint-disable-line global-require
-  return webpackPromisified(webpackDemoConfig).then(stats => {
+  return webpackPromisified(webpackDemoConfig).then((stats) => {
     log(
       '[webpack:build]',
       stats.toString({
@@ -244,7 +244,7 @@ const convertToESMGulpPlugin = () =>
           if (warning.code !== 'EMPTY_BUNDLE') handle(warning);
         },
       })
-        .then(bundle => bundle.generate({ format: 'esm' }))
+        .then((bundle) => bundle.generate({ format: 'esm' }))
         .then(
           ({ output }) => {
             file.contents = Buffer.from(
@@ -252,7 +252,7 @@ const convertToESMGulpPlugin = () =>
             );
             callback(null, file);
           },
-          err => {
+          (err) => {
             callback(err);
           }
         );
@@ -321,7 +321,7 @@ gulp.task('scripts:es', () => {
 });
 
 gulp.task('scripts:rollup', () =>
-  rollup(rollupConfigProd).then(bundle =>
+  rollup(rollupConfigProd).then((bundle) =>
     bundle.write({
       format: 'iife',
       name: 'CarbonComponents',
@@ -343,7 +343,7 @@ gulp.task('scripts:compiled', gulp.series('scripts:rollup', minifyJS));
  * Sass Tasks
  */
 
-const buildStyles = prod => {
+const buildStyles = (prod) => {
   const buildStylesForType = () =>
     gulp
       .src('src/globals/scss/styles.scss')
@@ -363,7 +363,7 @@ const buildStyles = prod => {
         ])
       )
       .pipe(
-        rename(filePath => {
+        rename((filePath) => {
           if (filePath.basename === 'styles') {
             filePath.basename = 'carbon-components';
           }
@@ -429,7 +429,7 @@ gulp.task('sass:dev', () => {
 });
 
 gulp.task('sass:dev:server', () => {
-  const debouncedSassBuild = debounce(switchTo => {
+  const debouncedSassBuild = debounce((switchTo) => {
     if (
       typeof useExperimentalFeatures === 'undefined' ||
       !useExperimentalFeatures !== !switchTo
@@ -439,7 +439,7 @@ gulp.task('sass:dev:server', () => {
       gulp.task('scripts:dev:feature-flags')();
     }
   }, 500);
-  return promisePortSassDevBuild.then(portSassDevBuild => {
+  return promisePortSassDevBuild.then((portSassDevBuild) => {
     http
       .createServer((req, res) => {
         const switchTo = (
@@ -485,21 +485,23 @@ const buildDemoHTML = () => {
         ),
         ...componentSource
           .map(({ handle }) =>
-            templates.render({ layout: false }, handle).then(renderedItems => {
-              const o = {};
-              renderedItems.forEach((rendered, item) => {
-                o[item.handle] = rendered.trim();
-              });
-              return writeFile(
-                path.resolve(__dirname, 'demo/code', handle),
-                JSON.stringify(o)
-              );
-            })
+            templates
+              .render({ layout: false }, handle)
+              .then((renderedItems) => {
+                const o = {};
+                renderedItems.forEach((rendered, item) => {
+                  o[item.handle] = rendered.trim();
+                });
+                return writeFile(
+                  path.resolve(__dirname, 'demo/code', handle),
+                  JSON.stringify(o)
+                );
+              })
           )
           .toArray(),
         templates
           .render({ layout: 'preview', layoutContext: { minify: true } })
-          .then(table =>
+          .then((table) =>
             Promise.all(
               Array.from(table.entries()).map(([{ handle }, value]) =>
                 writeFile(
@@ -522,14 +524,15 @@ const buildHTML = () => {
     'notification--toast': 'toast-notification',
   };
   getTemplates();
-  return templates.render({ layout: false }).then(renderedItems => {
+  return templates.render({ layout: false }).then((renderedItems) => {
     const promises = [];
     renderedItems.forEach((rendered, item) => {
       const dirname = path.dirname(
         path.resolve(__dirname, 'html', item.relViewPath)
       );
-      const filename = `${names[item.handle] ||
-        item.handle.replace(/--default$/, '')}.html`;
+      const filename = `${
+        names[item.handle] || item.handle.replace(/--default$/, '')
+      }.html`;
       promises.push(
         mkdirp(dirname).then(() =>
           writeFile(path.resolve(dirname, filename), rendered)
@@ -546,9 +549,9 @@ gulp.task('html:source', gulp.series('scripts:dev:feature-flags', buildHTML));
  * Dev server
  */
 
-const launchDevServer = cb => {
+const launchDevServer = (cb) => {
   promisePortSassDevBuild.then(
-    portSassDevBuild => {
+    (portSassDevBuild) => {
       let started;
       const options = {
         script: './server.js',
@@ -566,7 +569,7 @@ const launchDevServer = cb => {
         }
       });
     },
-    err => {
+    (err) => {
       console.log('Error finding the port for Sass dev build:', err); // eslint-disable-line no-console
     }
   );
@@ -584,7 +587,7 @@ gulp.task(
  * JSDoc
  */
 
-gulp.task('jsdoc', cb => {
+gulp.task('jsdoc', (cb) => {
   gulp
     .src('./src/**/*.js')
     .pipe(
@@ -606,7 +609,7 @@ gulp.task('jsdoc', cb => {
               destination: './docs/js',
             },
           }),
-          err => {
+          (err) => {
             if (err) {
               cb(err);
             } else {
@@ -623,7 +626,7 @@ gulp.task('jsdoc', cb => {
  * Test
  */
 
-const startTest = done => {
+const startTest = (done) => {
   new Server(
     {
       configFile: path.resolve(__dirname, 'tests/karma.conf.js'),
@@ -635,7 +638,7 @@ const startTest = done => {
 
 gulp.task('test:unit', gulp.series('html:source', startTest));
 
-const startAccessibilityTest = done => {
+const startAccessibilityTest = (done) => {
   const componentName = cloptions.name;
   const options = {
     a11yCheckOptions: {
diff --git a/packages/components/server.js b/packages/components/server.js
index 65a4bff2b90b..3f992010a1e8 100644
--- a/packages/components/server.js
+++ b/packages/components/server.js
@@ -23,7 +23,7 @@ const hotMiddleware = devMode && webpackHotMiddleware(compiler);
 let dummyHashSeq = 0;
 let templateOrConfigChanged = false;
 const watchCallback = debounce(() => {
-  const featureFlagCacheKey = Object.keys(require.cache).find(key =>
+  const featureFlagCacheKey = Object.keys(require.cache).find((key) =>
     /feature-flags\.js$/i.test(key)
   );
   if (featureFlagCacheKey) {
@@ -41,7 +41,7 @@ const watchCallback = debounce(() => {
   }
 }, 500);
 
-const invokeWatchCallback = name => {
+const invokeWatchCallback = (name) => {
   if (!/feature-flags\.js$/i.test(name)) {
     templateOrConfigChanged = true;
   }
@@ -96,7 +96,7 @@ function navRoute(req, res, next) {
           })
         );
       })
-      .catch(err => {
+      .catch((err) => {
         console.error(err.stack); // eslint-disable-line no-console
         res.writeHead(500);
         res.end();
@@ -117,7 +117,7 @@ function componentRoute(req, res, next) {
   } else {
     templates
       .render({ layout: 'preview', concat: true }, name)
-      .then(rendered => {
+      .then((rendered) => {
         // eslint-disable-next-line eqeqeq
         if (rendered == null) {
           res.writeHead(404);
@@ -127,7 +127,7 @@ function componentRoute(req, res, next) {
           res.end(rendered);
         }
       })
-      .catch(error => {
+      .catch((error) => {
         console.error(error.stack); // eslint-disable-line no-console
         res.writeHead(500);
         res.end();
@@ -148,7 +148,7 @@ function codeRoute(req, res, next) {
   } else {
     templates
       .render({ layout: false }, name)
-      .then(renderedItems => {
+      .then((renderedItems) => {
         const o = {};
         renderedItems.forEach((rendered, item) => {
           o[item.handle] = rendered.trim();
@@ -156,7 +156,7 @@ function codeRoute(req, res, next) {
         res.setHeader('Content-Type', 'application/json');
         res.end(JSON.stringify(o));
       })
-      .catch(error => {
+      .catch((error) => {
         console.error(error.stack); // eslint-disable-line no-console
         res.writeHead(500);
         res.end();
diff --git a/packages/components/src/components/accordion/accordion.js b/packages/components/src/components/accordion/accordion.js
index ad88cc0015e4..ff084b8d67d5 100644
--- a/packages/components/src/components/accordion/accordion.js
+++ b/packages/components/src/components/accordion/accordion.js
@@ -24,7 +24,7 @@ class Accordion extends mixin(createComponent, initComponentBySearch, handles) {
   constructor(element, options) {
     super(element, options);
     this.manage(
-      on(this.element, 'click', event => {
+      on(this.element, 'click', (event) => {
         const item = eventMatches(event, this.options.selectorAccordionItem);
         if (
           item &&
@@ -47,7 +47,7 @@ class Accordion extends mixin(createComponent, initComponentBySearch, handles) {
 
     if (!this._checkIfButton()) {
       this.manage(
-        on(this.element, 'keypress', event => {
+        on(this.element, 'keypress', (event) => {
           const item = eventMatches(event, this.options.selectorAccordionItem);
 
           if (
diff --git a/packages/components/src/components/checkbox/checkbox.js b/packages/components/src/components/checkbox/checkbox.js
index cdd947471f5b..05225dcf20c5 100644
--- a/packages/components/src/components/checkbox/checkbox.js
+++ b/packages/components/src/components/checkbox/checkbox.js
@@ -30,17 +30,17 @@ class Checkbox extends mixin(createComponent, initComponentBySearch, handles) {
   constructor(element, options) {
     super(element, options);
     this.manage(
-      on(this.element, 'click', event => {
+      on(this.element, 'click', (event) => {
         this._handleClick(event);
       })
     );
     this.manage(
-      on(this.element, 'focus', event => {
+      on(this.element, 'focus', (event) => {
         this._handleFocus(event);
       })
     );
     this.manage(
-      on(this.element, 'blur', event => {
+      on(this.element, 'blur', (event) => {
         this._handleBlur(event);
       })
     );
diff --git a/packages/components/src/components/code-snippet/code-snippet.js b/packages/components/src/components/code-snippet/code-snippet.js
index 1b334c1c5d9a..ec42082158cc 100644
--- a/packages/components/src/components/code-snippet/code-snippet.js
+++ b/packages/components/src/components/code-snippet/code-snippet.js
@@ -30,7 +30,7 @@ class CodeSnippet extends mixin(
     this._initCodeSnippet();
     this.element
       .querySelector(this.options.classExpandBtn)
-      .addEventListener('click', evt => this._handleClick(evt));
+      .addEventListener('click', (evt) => this._handleClick(evt));
   }
 
   _handleClick() {
diff --git a/packages/components/src/components/content-switcher/content-switcher.config.js b/packages/components/src/components/content-switcher/content-switcher.config.js
index 8dac5b33e4bd..da1bee6ddf8b 100644
--- a/packages/components/src/components/content-switcher/content-switcher.config.js
+++ b/packages/components/src/components/content-switcher/content-switcher.config.js
@@ -45,7 +45,7 @@ module.exports = {
       name: 'disabled',
       label: 'Disabled',
       context: {
-        items: items.map(item => ({ ...item, disabled: true })),
+        items: items.map((item) => ({ ...item, disabled: true })),
       },
     },
   ],
diff --git a/packages/components/src/components/content-switcher/content-switcher.js b/packages/components/src/components/content-switcher/content-switcher.js
index dcc4f4749988..02e437ff7738 100644
--- a/packages/components/src/components/content-switcher/content-switcher.js
+++ b/packages/components/src/components/content-switcher/content-switcher.js
@@ -14,7 +14,7 @@ import handles from '../../globals/js/mixins/handles';
 import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class ContentSwitcher extends mixin(
   createComponent,
@@ -41,7 +41,7 @@ class ContentSwitcher extends mixin(
   constructor(element, options) {
     super(element, options);
     this.manage(
-      on(this.element, 'click', event => {
+      on(this.element, 'click', (event) => {
         this._handleClick(event);
       })
     );
@@ -76,7 +76,7 @@ class ContentSwitcher extends mixin(
     const itemLink = item.querySelector(this.options.selectorLink);
     if (itemLink) {
       toArray(this.element.querySelectorAll(this.options.selectorLink)).forEach(
-        link => {
+        (link) => {
           if (link !== itemLink) {
             link.setAttribute('aria-selected', 'false');
           }
@@ -89,13 +89,13 @@ class ContentSwitcher extends mixin(
       this.element.querySelectorAll(this.options.selectorButton)
     );
 
-    selectorButtons.forEach(button => {
+    selectorButtons.forEach((button) => {
       if (button !== item) {
         button.setAttribute('aria-selected', false);
         button.classList.toggle(this.options.classActive, false);
         toArray(
           button.ownerDocument.querySelectorAll(button.dataset.target)
-        ).forEach(element => {
+        ).forEach((element) => {
           element.setAttribute('hidden', '');
           element.setAttribute('aria-hidden', 'true');
         });
@@ -105,7 +105,7 @@ class ContentSwitcher extends mixin(
     item.classList.toggle(this.options.classActive, true);
     item.setAttribute('aria-selected', true);
     toArray(item.ownerDocument.querySelectorAll(item.dataset.target)).forEach(
-      element => {
+      (element) => {
         element.removeAttribute('hidden');
         element.setAttribute('aria-hidden', 'false');
       }
@@ -130,7 +130,7 @@ class ContentSwitcher extends mixin(
         group: 'selected',
         item,
       },
-      error => {
+      (error) => {
         if (error) {
           if (callback) {
             callback(Object.assign(error, { item }));
diff --git a/packages/components/src/components/copy-button/copy-button.js b/packages/components/src/components/copy-button/copy-button.js
index 311526a8aafd..a92040ddc54d 100644
--- a/packages/components/src/components/copy-button/copy-button.js
+++ b/packages/components/src/components/copy-button/copy-button.js
@@ -28,7 +28,9 @@ class CopyButton extends mixin(
     super(element, options);
     this.manage(on(this.element, 'click', () => this.handleClick()));
     this.manage(
-      on(this.element, 'animationend', event => this.handleAnimationEnd(event))
+      on(this.element, 'animationend', (event) =>
+        this.handleAnimationEnd(event)
+      )
     );
   }
 
diff --git a/packages/components/src/components/data-table/data-table.config.js b/packages/components/src/components/data-table/data-table.config.js
index 2162540286cc..e2cbb6a561be 100644
--- a/packages/components/src/components/data-table/data-table.config.js
+++ b/packages/components/src/components/data-table/data-table.config.js
@@ -202,7 +202,7 @@ const columnsExpandable = [
   },
 ];
 
-const columnsSmall = columns.slice(1, -1).map(column => ({
+const columnsSmall = columns.slice(1, -1).map((column) => ({
   ...column,
   sortable: false,
 }));
diff --git a/packages/components/src/components/data-table/data-table.js b/packages/components/src/components/data-table/data-table.js
index 7366b3f22936..c9642b0a3385 100644
--- a/packages/components/src/components/data-table/data-table.js
+++ b/packages/components/src/components/data-table/data-table.js
@@ -14,7 +14,7 @@ import handles from '../../globals/js/mixins/handles';
 import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class DataTable extends mixin(
   createComponent,
@@ -61,7 +61,7 @@ class DataTable extends mixin(
     this.manage(on(this.element, 'mouseout', this._expandableHoverToggle));
 
     this.manage(
-      on(this.element, 'click', evt => {
+      on(this.element, 'click', (evt) => {
         const eventElement = eventMatches(evt, this.options.eventTrigger);
         const searchContainer = this.element.querySelector(
           this.options.selectorToolbarSearchContainer
@@ -130,10 +130,10 @@ class DataTable extends mixin(
     }
   }
 
-  _sortToggle = detail => {
+  _sortToggle = (detail) => {
     const { element, previousValue } = detail;
 
-    toArray(this.tableHeaders).forEach(header => {
+    toArray(this.tableHeaders).forEach((header) => {
       const sortEl = header.querySelector(this.options.selectorTableSort);
 
       if (sortEl !== null && sortEl !== element) {
@@ -157,7 +157,7 @@ class DataTable extends mixin(
     }
   };
 
-  _selectToggle = detail => {
+  _selectToggle = (detail) => {
     const { element } = detail;
     const { checked } = element;
 
@@ -182,7 +182,7 @@ class DataTable extends mixin(
 
     this.state.checkboxCount = checked ? inputs.length - 1 : 0;
 
-    inputs.forEach(item => {
+    inputs.forEach((item) => {
       item.checked = checked;
 
       const row = item.parentNode.parentNode;
@@ -208,11 +208,11 @@ class DataTable extends mixin(
       this.element.querySelectorAll(this.options.selectorTableSelected)
     );
 
-    row.forEach(item => {
+    row.forEach((item) => {
       item.classList.remove(this.options.classTableSelected);
     });
 
-    inputs.forEach(item => {
+    inputs.forEach((item) => {
       item.checked = false;
     });
 
@@ -224,9 +224,9 @@ class DataTable extends mixin(
     }
   };
 
-  _actionBarToggle = toggleOn => {
+  _actionBarToggle = (toggleOn) => {
     let handleTransitionEnd;
-    const transition = evt => {
+    const transition = (evt) => {
       if (handleTransitionEnd) {
         handleTransitionEnd = this.unmanage(handleTransitionEnd).release();
       }
@@ -288,12 +288,12 @@ class DataTable extends mixin(
     const expandCells = this.element.querySelectorAll(
       this.options.selectorExpandCells
     );
-    Array.prototype.forEach.call(expandCells, cell => {
+    Array.prototype.forEach.call(expandCells, (cell) => {
       this._rowExpandToggle({ element: cell, forceExpand: shouldExpand });
     });
   };
 
-  _expandableHoverToggle = evt => {
+  _expandableHoverToggle = (evt) => {
     const element = eventMatches(evt, this.options.selectorChildRow);
     if (element) {
       element.previousElementSibling.classList.toggle(
@@ -318,7 +318,7 @@ class DataTable extends mixin(
     });
   };
 
-  _keydownHandler = evt => {
+  _keydownHandler = (evt) => {
     const searchContainer = this.element.querySelector(
       this.options.selectorToolbarSearchContainer
     );
@@ -359,13 +359,13 @@ class DataTable extends mixin(
     // check if this is a refresh or the first time
     if (this.parentRows.length > 0) {
       const diffParentRows = newParentRows.filter(
-        newRow => !this.parentRows.some(oldRow => oldRow === newRow)
+        (newRow) => !this.parentRows.some((oldRow) => oldRow === newRow)
       );
 
       // check if there are expandable rows
       if (newExpandableRows.length > 0) {
         const diffExpandableRows = diffParentRows.map(
-          newRow => newRow.nextElementSibling
+          (newRow) => newRow.nextElementSibling
         );
         const mergedExpandableRows = [
           ...toArray(this.expandableRows),
diff --git a/packages/components/src/components/date-picker/date-picker.js b/packages/components/src/components/date-picker/date-picker.js
index 6b5191fa0f03..314df07b9544 100644
--- a/packages/components/src/components/date-picker/date-picker.js
+++ b/packages/components/src/components/date-picker/date-picker.js
@@ -38,7 +38,7 @@ Flatpickr.l10ns.en.weekdays.shorthand.forEach((day, index) => {
   }
 });
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 /**
  * @param {number} monthNumber The month number.
@@ -58,12 +58,12 @@ const monthToStr = (monthNumber, shorthand, locale) =>
  * @param {string} config.classFlatpickrCurrentMonth The CSS class for the text-based month selection UI.
  * @returns {Plugin} A Flatpickr plugin to use text instead of `<select>` for month picker.
  */
-const carbonFlatpickrMonthSelectPlugin = config => fp => {
+const carbonFlatpickrMonthSelectPlugin = (config) => (fp) => {
   const setupElements = () => {
     if (!fp.monthElements) {
       return;
     }
-    fp.monthElements.forEach(elem => {
+    fp.monthElements.forEach((elem) => {
       if (!elem.parentNode) return;
       elem.parentNode.removeChild(elem);
     });
@@ -98,13 +98,13 @@ const carbonFlatpickrMonthSelectPlugin = config => fp => {
       config.shorthand === true,
       fp.l10n
     );
-    fp.yearElements.forEach(elem => {
+    fp.yearElements.forEach((elem) => {
       const currentMonthContainer = elem.closest(
         config.selectorFlatpickrMonthYearContainer
       );
       Array.prototype.forEach.call(
         currentMonthContainer.querySelectorAll('.cur-month'),
-        monthElement => {
+        (monthElement) => {
           monthElement.textContent = monthStr;
         }
       );
@@ -141,7 +141,7 @@ class DatePicker extends mixin(
     this.calendar = this._initDatePicker(type);
     if (this.calendar.calendarContainer) {
       this.manage(
-        on(this.element, 'keydown', e => {
+        on(this.element, 'keydown', (e) => {
           if (e.which === 40) {
             e.preventDefault();
             (
@@ -153,7 +153,7 @@ class DatePicker extends mixin(
         })
       );
       this.manage(
-        on(this.calendar.calendarContainer, 'keydown', e => {
+        on(this.calendar.calendarContainer, 'keydown', (e) => {
           if (e.which === 9 && type === 'range') {
             this._updateClassNames(this.calendar);
             this.element
@@ -181,7 +181,7 @@ class DatePicker extends mixin(
    * Used only for range mode for now.
    * @private
    */
-  _handleBlur = event => {
+  _handleBlur = (event) => {
     if (this.calendar) {
       const focusTo = event.relatedTarget;
       if (
@@ -195,7 +195,7 @@ class DatePicker extends mixin(
     }
   };
 
-  _initDatePicker = type => {
+  _initDatePicker = (type) => {
     if (type === 'range') {
       // Given FlatPickr assumes one `<input>` even in range mode,
       // use a hidden `<input>` for such purpose, separate from our from/to `<input>`s
@@ -383,7 +383,7 @@ class DatePicker extends mixin(
     }
     const inputField = input;
     this.manage(
-      on(inputField, 'change', evt => {
+      on(inputField, 'change', (evt) => {
         if (evt.isTrusted || (evt.detail && evt.detail.isNotFromFlatpickr)) {
           const inputDate = this.calendar.parseDate(inputField.value);
           if (inputDate && !isNaN(inputDate.valueOf())) {
@@ -402,7 +402,7 @@ class DatePicker extends mixin(
     // An attempt to temporarily set the `<input>` being edited as the one FlatPicker manages,
     // as FlatPicker attempts to take over `keydown` event handler on `document` to run on the date picker dropdown.
     this.manage(
-      on(inputField, 'keydown', evt => {
+      on(inputField, 'keydown', (evt) => {
         const origInput = this.calendar._input;
         this.calendar._input = evt.target;
         setTimeout(() => {
@@ -425,14 +425,14 @@ class DatePicker extends mixin(
         .querySelector('.flatpickr-days')
         .classList.add(this.options.classDays);
       toArray(calendarContainer.querySelectorAll('.flatpickr-weekday')).forEach(
-        item => {
+        (item) => {
           const currentItem = item;
           currentItem.innerHTML = currentItem.innerHTML.replace(/\s+/g, '');
           currentItem.classList.add(this.options.classWeekday);
         }
       );
       toArray(calendarContainer.querySelectorAll('.flatpickr-day')).forEach(
-        item => {
+        (item) => {
           item.classList.add(this.options.classDay);
           if (item.classList.contains('today') && selectedDates.length > 0) {
             item.classList.add('no-border');
@@ -469,7 +469,7 @@ class DatePicker extends mixin(
     this._updateClassNames(this.calendar);
   };
 
-  _formatDate = date =>
+  _formatDate = (date) =>
     this.calendar.formatDate(date, this.calendar.config.dateFormat);
 
   release() {
diff --git a/packages/components/src/components/dropdown/dropdown.config.js b/packages/components/src/components/dropdown/dropdown.config.js
index c43c2fbe5865..3a662e871fb5 100644
--- a/packages/components/src/components/dropdown/dropdown.config.js
+++ b/packages/components/src/components/dropdown/dropdown.config.js
@@ -41,24 +41,16 @@ module.exports = {
   context: {
     prefix,
     default: {
-      idSuffix: `example-${Math.random()
-        .toString(36)
-        .substr(2)}`,
+      idSuffix: `example-${Math.random().toString(36).substr(2)}`,
     },
     helper: {
-      idSuffix: `example-${Math.random()
-        .toString(36)
-        .substr(2)}`,
+      idSuffix: `example-${Math.random().toString(36).substr(2)}`,
     },
     disabled: {
-      idSuffix: `example-${Math.random()
-        .toString(36)
-        .substr(2)}`,
+      idSuffix: `example-${Math.random().toString(36).substr(2)}`,
     },
     invalid: {
-      idSuffix: `example-${Math.random()
-        .toString(36)
-        .substr(2)}`,
+      idSuffix: `example-${Math.random().toString(36).substr(2)}`,
     },
   },
   variants: [
diff --git a/packages/components/src/components/dropdown/dropdown.js b/packages/components/src/components/dropdown/dropdown.js
index 12802ef69b96..98960a3105ed 100644
--- a/packages/components/src/components/dropdown/dropdown.js
+++ b/packages/components/src/components/dropdown/dropdown.js
@@ -13,7 +13,7 @@ import trackBlur from '../../globals/js/mixins/track-blur';
 import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class Dropdown extends mixin(
   createComponent,
@@ -41,17 +41,17 @@ class Dropdown extends mixin(
     super(element, options);
 
     this.manage(
-      on(this.element.ownerDocument, 'click', event => {
+      on(this.element.ownerDocument, 'click', (event) => {
         this._toggle(event);
       })
     );
     this.manage(
-      on(this.element, 'keydown', event => {
+      on(this.element, 'keydown', (event) => {
         this._handleKeyDown(event);
       })
     );
     this.manage(
-      on(this.element, 'click', event => {
+      on(this.element, 'click', (event) => {
         const item = eventMatches(event, this.options.selectorItem);
         if (item) {
           this.select(item);
@@ -71,7 +71,7 @@ class Dropdown extends mixin(
     ) {
       // Using the latest HTML structure that supports the aria-activedescendant attribute
       this.manage(
-        on(this.element, 'mouseover', event => {
+        on(this.element, 'mouseover', (event) => {
           const item = eventMatches(event, this.options.selectorItem);
           if (item) {
             this._updateFocus(item);
@@ -209,7 +209,7 @@ class Dropdown extends mixin(
         toggle: isOfSelf && event.which !== 27 && event.which !== 40,
       };
       let changedState = false;
-      Object.keys(actions).forEach(action => {
+      Object.keys(actions).forEach((action) => {
         if (actions[action]) {
           changedState = true;
           this.element.classList[action](this.options.classOpen);
@@ -260,7 +260,7 @@ class Dropdown extends mixin(
 
       // @todo remove once legacy structure is depreciated
       if (!triggerNode) {
-        listItems.forEach(item => {
+        listItems.forEach((item) => {
           if (this.element.classList.contains(this.options.classOpen)) {
             item.tabIndex = 0;
           } else {
@@ -319,7 +319,7 @@ class Dropdown extends mixin(
     const start =
       this.getCurrentNavigation() ||
       this.element.querySelector(this.options.selectorLinkSelected);
-    const getNextItem = old => {
+    const getNextItem = (old) => {
       const handleUnderflow = (i, l) => i + (i >= 0 ? 0 : l);
       const handleOverflow = (i, l) => i - (i < l ? 0 : l);
       // `items.indexOf(old)` may be -1 (Scenario of no previous focus)
@@ -388,7 +388,7 @@ class Dropdown extends mixin(
 
       toArray(
         this.element.querySelectorAll(this.options.selectorLinkSelected)
-      ).forEach(item => {
+      ).forEach((item) => {
         if (itemToSelect !== item) {
           item.parentElement.classList.remove(this.options.classSelected);
         }
diff --git a/packages/components/src/components/file-uploader/file-uploader.js b/packages/components/src/components/file-uploader/file-uploader.js
index 0d3ccfa437cb..0b6356849ddf 100644
--- a/packages/components/src/components/file-uploader/file-uploader.js
+++ b/packages/components/src/components/file-uploader/file-uploader.js
@@ -14,7 +14,7 @@ import handles from '../../globals/js/mixins/handles';
 import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class FileUploader extends mixin(
   createComponent,
@@ -136,7 +136,7 @@ class FileUploader extends mixin(
       this.options.selectorContainer
     );
     const HTMLString = toArray(files)
-      .map(file => this._filenamesHTML(file.name, this.inputId))
+      .map((file) => this._filenamesHTML(file.name, this.inputId))
       .join('');
 
     container.insertAdjacentHTML('afterbegin', HTMLString);
@@ -155,7 +155,7 @@ class FileUploader extends mixin(
 
   _handleStateChange(elements, selectIndex, html) {
     if (selectIndex === undefined) {
-      elements.forEach(el => {
+      elements.forEach((el) => {
         this._removeState(el);
         el.insertAdjacentHTML('beforeend', html);
       });
@@ -174,7 +174,7 @@ class FileUploader extends mixin(
    * @param {Event} evt The event triggering this action.
    * @private
    */
-  _handleDeleteButton = evt => {
+  _handleDeleteButton = (evt) => {
     const target = eventMatches(evt, this.options.selectorCloseButton);
     if (target) {
       this.changeState('delete-filename-fileuploader', {
@@ -189,7 +189,7 @@ class FileUploader extends mixin(
    * @param {MouseEvent} evt The event.
    * @private
    */
-  _handleDragDrop = evt => {
+  _handleDragDrop = (evt) => {
     const isOfSelf = this.element.contains(evt.target);
     // In IE11 `evt.dataTransfer.types` is a `DOMStringList` instead of an array
     if (
diff --git a/packages/components/src/components/floating-menu/floating-menu.js b/packages/components/src/components/floating-menu/floating-menu.js
index fa50ebfc36d5..5f2091b597fd 100644
--- a/packages/components/src/components/floating-menu/floating-menu.js
+++ b/packages/components/src/components/floating-menu/floating-menu.js
@@ -142,7 +142,7 @@ class FloatingMenu extends mixin(
       );
     }
     this.manage(
-      on(this.element.ownerDocument, 'keydown', event => {
+      on(this.element.ownerDocument, 'keydown', (event) => {
         this._handleKeydown(event);
       })
     );
@@ -246,7 +246,7 @@ class FloatingMenu extends mixin(
       right: 'auto',
       margin: 0,
     };
-    Object.keys(styles).forEach(key => {
+    Object.keys(styles).forEach((key) => {
       const expected =
         typeof styles[key] === 'number' ? parseFloat(styles[key]) : styles[key];
       const actual = computedStyle.getPropertyValue(key);
diff --git a/packages/components/src/components/inline-loading/inline-loading.js b/packages/components/src/components/inline-loading/inline-loading.js
index 118bc994d586..02951640039e 100644
--- a/packages/components/src/components/inline-loading/inline-loading.js
+++ b/packages/components/src/components/inline-loading/inline-loading.js
@@ -41,7 +41,7 @@ class InlineLoading extends mixin(
    */
   setState(state) {
     const { states } = this.constructor;
-    const values = Object.keys(states).map(key => states[key]);
+    const values = Object.keys(states).map((key) => states[key]);
     if (values.indexOf(state) < 0) {
       throw new Error(
         `One of the following value should be given as the state: ${values.join(
diff --git a/packages/components/src/components/loading/loading.js b/packages/components/src/components/loading/loading.js
index c242a7531702..bdb38cc93814 100644
--- a/packages/components/src/components/loading/loading.js
+++ b/packages/components/src/components/loading/loading.js
@@ -81,7 +81,7 @@ class Loading extends mixin(createComponent, initComponentBySearch, handles) {
   end() {
     this.set(false);
     let handleAnimationEnd = this.manage(
-      on(this.element, 'animationend', evt => {
+      on(this.element, 'animationend', (evt) => {
         if (handleAnimationEnd) {
           handleAnimationEnd = this.unmanage(handleAnimationEnd).release();
         }
diff --git a/packages/components/src/components/modal/modal.config.js b/packages/components/src/components/modal/modal.config.js
index 39612962510d..af435d08e571 100644
--- a/packages/components/src/components/modal/modal.config.js
+++ b/packages/components/src/components/modal/modal.config.js
@@ -22,9 +22,7 @@ module.exports = {
         Modals communicate information via a secondary window and allow the user to maintain the context of a particular task.
       `,
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -34,9 +32,7 @@ module.exports = {
       name: 'xs',
       label: 'Transactional Modal (XS)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -47,9 +43,7 @@ module.exports = {
       name: 'sm',
       label: 'Transactional Modal (Small)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -60,9 +54,7 @@ module.exports = {
       name: 'lg',
       label: 'Transactional Modal (Large)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -74,9 +66,7 @@ module.exports = {
       label: 'Passive Modal',
       notes: 'Passive Modals are modals without footers.',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: false,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -86,9 +76,7 @@ module.exports = {
       name: 'nofooter-xs',
       label: 'Passive Modal (XS)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: false,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -99,9 +87,7 @@ module.exports = {
       name: 'nofooter-sm',
       label: 'Passive Modal (Small)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: false,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -112,9 +98,7 @@ module.exports = {
       name: 'nofooter-lg',
       label: 'Passive Modal (Large)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: false,
         classPrimaryButton: `${prefix}--btn--primary`,
         classCloseButton: `${prefix}--btn--secondary`,
@@ -125,9 +109,7 @@ module.exports = {
       name: 'titleonly-xs',
       label: 'Title Only Modal (XS)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasBody: false,
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
@@ -139,9 +121,7 @@ module.exports = {
       name: 'titleonly-sm',
       label: 'Title Only Modal (Small)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasBody: false,
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
@@ -153,9 +133,7 @@ module.exports = {
       name: 'titleonly-nofooter-xs',
       label: 'Title Only Passive Modal (XS)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasBody: false,
         hasFooter: false,
         classPrimaryButton: `${prefix}--btn--primary`,
@@ -167,9 +145,7 @@ module.exports = {
       name: 'titleonly-nofooter-sm',
       label: 'Title Only Passive Modal (Small)',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasBody: false,
         hasFooter: false,
         classPrimaryButton: `${prefix}--btn--primary`,
@@ -181,9 +157,7 @@ module.exports = {
       name: 'danger',
       label: 'Danger Modal',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasFooter: true,
         labelPrimaryButton: 'Danger',
         classModalSupplemental: `${prefix}--modal--danger`,
@@ -195,9 +169,7 @@ module.exports = {
       name: 'input',
       label: 'Input Modal',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasInput: true,
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
@@ -208,9 +180,7 @@ module.exports = {
       name: 'scrolling',
       label: 'Modal with scrolling content',
       context: {
-        idSuffix: Math.random()
-          .toString(36)
-          .substr(2),
+        idSuffix: Math.random().toString(36).substr(2),
         hasScrollingContent: true,
         hasFooter: true,
         classPrimaryButton: `${prefix}--btn--primary`,
diff --git a/packages/components/src/components/modal/modal.js b/packages/components/src/components/modal/modal.js
index 83910d51f852..3c3af913887f 100644
--- a/packages/components/src/components/modal/modal.js
+++ b/packages/components/src/components/modal/modal.js
@@ -165,7 +165,7 @@ class Modal extends mixin(
 
   _hookCloseActions() {
     this.manage(
-      on(this.element, 'click', evt => {
+      on(this.element, 'click', (evt) => {
         const closeButton = eventMatches(evt, this.options.selectorModalClose);
         if (closeButton) {
           evt.delegateTarget = closeButton; // eslint-disable-line no-param-reassign
@@ -183,7 +183,7 @@ class Modal extends mixin(
     }
 
     this._handleKeydownListener = this.manage(
-      on(this.element.ownerDocument.body, 'keydown', evt => {
+      on(this.element.ownerDocument.body, 'keydown', (evt) => {
         // Avoid running `evt.stopPropagation()` only when modal is shown
         if (evt.which === 27 && this.shouldStateBeChanged('hidden')) {
           evt.stopPropagation();
@@ -198,7 +198,7 @@ class Modal extends mixin(
    * @param {Event} evt The event.
    * @private
    */
-  _handleFocusin = evt => {
+  _handleFocusin = (evt) => {
     const focusWrapNode =
       this.element.querySelector(this.options.selectorModalContainer) ||
       this.element;
@@ -206,7 +206,7 @@ class Modal extends mixin(
       this.element.classList.contains(this.options.classVisible) &&
       !focusWrapNode.contains(evt.target) &&
       this.options.selectorsFloatingMenus.every(
-        selector => !eventMatches(evt, selector)
+        (selector) => !eventMatches(evt, selector)
       )
     ) {
       this.element.querySelector(settings.selectorTabbable).focus();
diff --git a/packages/components/src/components/notification/notification.js b/packages/components/src/components/notification/notification.js
index be471c8e4b12..4665e4fad950 100644
--- a/packages/components/src/components/notification/notification.js
+++ b/packages/components/src/components/notification/notification.js
@@ -30,7 +30,7 @@ class Notification extends mixin(
     this.button = element.querySelector(this.options.selectorButton);
     if (this.button) {
       this.manage(
-        on(this.button, 'click', evt => {
+        on(this.button, 'click', (evt) => {
           if (evt.currentTarget === this.button) {
             this.remove();
           }
diff --git a/packages/components/src/components/number-input/number-input.js b/packages/components/src/components/number-input/number-input.js
index 5b17d570d318..ed512703d086 100644
--- a/packages/components/src/components/number-input/number-input.js
+++ b/packages/components/src/components/number-input/number-input.js
@@ -29,12 +29,12 @@ class NumberInput extends mixin(
     // Broken DOM tree is seen with up/down arrows <svg> in IE, which breaks event delegation.
     // <svg> does not have `Element.classList` in IE11
     this.manage(
-      on(this.element.querySelector('.up-icon'), 'click', event => {
+      on(this.element.querySelector('.up-icon'), 'click', (event) => {
         this._handleClick(event);
       })
     );
     this.manage(
-      on(this.element.querySelector('.down-icon'), 'click', event => {
+      on(this.element.querySelector('.down-icon'), 'click', (event) => {
         this._handleClick(event);
       })
     );
diff --git a/packages/components/src/components/overflow-menu/overflow-menu.config.js b/packages/components/src/components/overflow-menu/overflow-menu.config.js
index 8766979ed890..5470facb2ae0 100644
--- a/packages/components/src/components/overflow-menu/overflow-menu.config.js
+++ b/packages/components/src/components/overflow-menu/overflow-menu.config.js
@@ -37,15 +37,9 @@ const items = [
 ];
 
 const idSuffix = {
-  default: `example-${Math.random()
-    .toString(36)
-    .substr(2)}`,
-  flip: `example-${Math.random()
-    .toString(36)
-    .substr(2)}`,
-  link: `example-${Math.random()
-    .toString(36)
-    .substr(2)}`,
+  default: `example-${Math.random().toString(36).substr(2)}`,
+  flip: `example-${Math.random().toString(36).substr(2)}`,
+  link: `example-${Math.random().toString(36).substr(2)}`,
 };
 
 module.exports = {
diff --git a/packages/components/src/components/overflow-menu/overflow-menu.js b/packages/components/src/components/overflow-menu/overflow-menu.js
index 6eafb77f1b15..72c5662242cf 100644
--- a/packages/components/src/components/overflow-menu/overflow-menu.js
+++ b/packages/components/src/components/overflow-menu/overflow-menu.js
@@ -124,13 +124,13 @@ class OverflowMenu extends mixin(
       );
     }
     this.manage(
-      on(this.element.ownerDocument, 'click', event => {
+      on(this.element.ownerDocument, 'click', (event) => {
         this._handleDocumentClick(event);
         this.wasOpenBeforeClick = undefined;
       })
     );
     this.manage(
-      on(this.element.ownerDocument, 'keydown', event => {
+      on(this.element.ownerDocument, 'keydown', (event) => {
         this._handleKeyPress(event);
       })
     );
@@ -229,14 +229,14 @@ class OverflowMenu extends mixin(
    * Moves the focus up/down.
    * @param {number} direction The direction of navigating.
    */
-  navigate = direction => {
+  navigate = (direction) => {
     const items = [
       ...this.element.ownerDocument.querySelectorAll(this.options.selectorItem),
     ];
     const start =
       this.getCurrentNavigation() ||
       this.element.querySelector(this.options.selectorItemSelected);
-    const getNextItem = old => {
+    const getNextItem = (old) => {
       const handleUnderflow = (index, length) =>
         index + (index >= 0 ? 0 : length);
       const handleOverflow = (index, length) =>
diff --git a/packages/components/src/components/pagination-nav/pagination-nav.js b/packages/components/src/components/pagination-nav/pagination-nav.js
index f9c0d6a4358d..5f5c867c3b0c 100644
--- a/packages/components/src/components/pagination-nav/pagination-nav.js
+++ b/packages/components/src/components/pagination-nav/pagination-nav.js
@@ -26,9 +26,9 @@ class PaginationNav extends mixin(
    */
   constructor(element, options) {
     super(element, options);
-    this.manage(on(this.element, 'click', evt => this.handleClick(evt)));
+    this.manage(on(this.element, 'click', (evt) => this.handleClick(evt)));
     this.manage(
-      on(this.element, 'change', evt => {
+      on(this.element, 'change', (evt) => {
         if (evt.target.matches(this.options.selectorPageSelect)) {
           this.handleSelectChange(evt);
         }
@@ -53,14 +53,14 @@ class PaginationNav extends mixin(
   /**
    * Clear active page attributes
    */
-  clearActivePage = evt => {
+  clearActivePage = (evt) => {
     const pageButtonNodeList = this.element.querySelectorAll(
       this.options.selectorPageButton
     );
     const pageSelectElement = this.element.querySelector(
       this.options.selectorPageSelect
     );
-    Array.prototype.forEach.call(pageButtonNodeList, el => {
+    Array.prototype.forEach.call(pageButtonNodeList, (el) => {
       el.classList.remove(this.options.classActive, this.options.classDisabled);
       el.removeAttribute(this.options.attribActive);
       el.removeAttribute('aria-disabled');
@@ -69,7 +69,7 @@ class PaginationNav extends mixin(
     if (pageSelectElement) {
       pageSelectElement.removeAttribute('aria-current');
       const pageSelectElementOptions = pageSelectElement.options;
-      Array.prototype.forEach.call(pageSelectElementOptions, el => {
+      Array.prototype.forEach.call(pageSelectElementOptions, (el) => {
         el.removeAttribute(this.options.attribActive);
       });
       if (!evt.target.matches(this.options.selectorPageSelect)) {
@@ -82,7 +82,7 @@ class PaginationNav extends mixin(
   /**
    * Add active state on click
    */
-  handleClick = evt => {
+  handleClick = (evt) => {
     if (!evt.target.getAttribute('aria-disabled') === true) {
       let nextActivePageNumber = this.getActivePageNumber();
       const pageElementNodeList = this.element.querySelectorAll(
@@ -124,7 +124,7 @@ class PaginationNav extends mixin(
   /**
    * Handle select menu on change
    */
-  handleSelectChange = evt => {
+  handleSelectChange = (evt) => {
     this.clearActivePage(evt);
     const pageSelectElement = this.element.querySelector(
       this.options.selectorPageSelect
diff --git a/packages/components/src/components/pagination/pagination.js b/packages/components/src/components/pagination/pagination.js
index c65e4e99f2b4..193f43c3ea29 100644
--- a/packages/components/src/components/pagination/pagination.js
+++ b/packages/components/src/components/pagination/pagination.js
@@ -43,7 +43,7 @@ class Pagination extends mixin(
     super(element, options);
 
     this.manage(
-      on(this.element, 'click', evt => {
+      on(this.element, 'click', (evt) => {
         if (eventMatches(evt, this.options.selectorPageBackward)) {
           const detail = {
             initialEvt: evt,
@@ -63,7 +63,7 @@ class Pagination extends mixin(
     );
 
     this.manage(
-      on(this.element, 'input', evt => {
+      on(this.element, 'input', (evt) => {
         if (eventMatches(evt, this.options.selectorItemsPerPageInput)) {
           const detail = {
             initialEvt: evt,
diff --git a/packages/components/src/components/progress-indicator/progress-indicator.config.js b/packages/components/src/components/progress-indicator/progress-indicator.config.js
index 9b4d97c0489c..10e5aee19379 100644
--- a/packages/components/src/components/progress-indicator/progress-indicator.config.js
+++ b/packages/components/src/components/progress-indicator/progress-indicator.config.js
@@ -21,18 +21,14 @@ const steps = [
     label: 'Second Step',
     overflow: true,
     overflowLabel: 'Overflow Ex.1',
-    tooltipId: Math.random()
-      .toString(36)
-      .substr(2),
+    tooltipId: Math.random().toString(36).substr(2),
   },
   {
     state: 'incomplete',
     label: 'Third Step',
     overflow: true,
     overflowLabel: 'Overflow Ex. 2 Multi Line',
-    tooltipId: Math.random()
-      .toString(36)
-      .substr(2),
+    tooltipId: Math.random().toString(36).substr(2),
   },
   {
     state: 'incomplete',
diff --git a/packages/components/src/components/progress-indicator/progress-indicator.js b/packages/components/src/components/progress-indicator/progress-indicator.js
index 2c86b706cbab..8ac5202462be 100644
--- a/packages/components/src/components/progress-indicator/progress-indicator.js
+++ b/packages/components/src/components/progress-indicator/progress-indicator.js
@@ -10,7 +10,7 @@ import mixin from '../../globals/js/misc/mixin';
 import createComponent from '../../globals/js/mixins/create-component';
 import initComponentBySearch from '../../globals/js/mixins/init-component-by-search';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class ProgressIndicator extends mixin(createComponent, initComponentBySearch) {
   /**
@@ -69,7 +69,7 @@ class ProgressIndicator extends mixin(createComponent, initComponentBySearch) {
    */
   getCurrent() {
     const currentEl = this.element.querySelector(this.options.selectorCurrent);
-    return this.getSteps().filter(step => step.element === currentEl)[0];
+    return this.getSteps().filter((step) => step.element === currentEl)[0];
   }
 
   /**
@@ -85,7 +85,7 @@ class ProgressIndicator extends mixin(createComponent, initComponentBySearch) {
     }
 
     if (changed) {
-      this.getSteps().forEach(step => {
+      this.getSteps().forEach((step) => {
         if (step.index < newCurrentStep) {
           this._updateStep({
             element: step.element,
@@ -172,13 +172,13 @@ class ProgressIndicator extends mixin(createComponent, initComponentBySearch) {
       this.element.querySelectorAll(this.options.selectorTooltip)
     );
 
-    stepLabels.forEach(step => {
+    stepLabels.forEach((step) => {
       if (step.scrollWidth > this.options.maxWidth) {
         step.classList.add(this.options.classOverflowLabel);
       }
     });
 
-    tooltips.forEach(tooltip => {
+    tooltips.forEach((tooltip) => {
       const childText = tooltip.querySelector(this.options.selectorTooltipText);
       if (childText.scrollHeight > this.options.tooltipMaxHeight) {
         tooltip.classList.add(this.options.classTooltipMulti);
diff --git a/packages/components/src/components/radio-button/radio-button.config.js b/packages/components/src/components/radio-button/radio-button.config.js
index afc8afabdde9..754678b888ca 100644
--- a/packages/components/src/components/radio-button/radio-button.config.js
+++ b/packages/components/src/components/radio-button/radio-button.config.js
@@ -10,9 +10,7 @@
 const { prefix } = require('../../globals/js/settings');
 
 const items = () => {
-  const groupId = Math.random()
-    .toString(36)
-    .substr(2);
+  const groupId = Math.random().toString(36).substr(2);
   return [
     {
       id: `radio-button-${groupId}-1`,
diff --git a/packages/components/src/components/removed-component.js b/packages/components/src/components/removed-component.js
index 4a918e9e41e3..d3e29923bc5d 100644
--- a/packages/components/src/components/removed-component.js
+++ b/packages/components/src/components/removed-component.js
@@ -11,7 +11,7 @@ import warning from 'warning';
  * @param {string} name The component name.
  * @returns {Function} A stub of removed component.
  */
-const removedComponent = name => {
+const removedComponent = (name) => {
   let didWarnAboutRemoval = false;
   const warn = () => {
     if (__DEV__) {
diff --git a/packages/components/src/components/search/search.js b/packages/components/src/components/search/search.js
index b431f0c249f1..285fc4fbb059 100644
--- a/packages/components/src/components/search/search.js
+++ b/packages/components/src/components/search/search.js
@@ -14,7 +14,7 @@ import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 import svgToggleClass from '../../globals/js/misc/svg-toggle-class';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class Search extends mixin(createComponent, initComponentBySearch, handles) {
   /**
@@ -57,7 +57,7 @@ class Search extends mixin(createComponent, initComponentBySearch, handles) {
     }
 
     this.manage(
-      on(this.element, 'click', evt => {
+      on(this.element, 'click', (evt) => {
         const toggleItem = eventMatches(
           evt,
           this.options.selectorIconContainer
@@ -67,7 +67,7 @@ class Search extends mixin(createComponent, initComponentBySearch, handles) {
     );
 
     this.manage(
-      on(input, 'input', evt => {
+      on(input, 'input', (evt) => {
         if (closeIcon) this.showClear(evt.target.value, closeIcon);
       })
     );
@@ -79,7 +79,7 @@ class Search extends mixin(createComponent, initComponentBySearch, handles) {
    */
   toggleLayout(element) {
     toArray(element.querySelectorAll(this.options.selectorSearchView)).forEach(
-      item => {
+      (item) => {
         item.classList.toggle(this.options.classLayoutHidden);
       }
     );
diff --git a/packages/components/src/components/slider/slider.js b/packages/components/src/components/slider/slider.js
index d71855ab57f8..8ee20e2b8f6c 100644
--- a/packages/components/src/components/slider/slider.js
+++ b/packages/components/src/components/slider/slider.js
@@ -45,18 +45,18 @@ class Slider extends mixin(
       );
       this._updateInput();
       this.manage(
-        on(this.boundInput, 'change', evt => {
+        on(this.boundInput, 'change', (evt) => {
           this.setValue(evt.target.value);
         })
       );
       this.manage(
-        on(this.boundInput, 'focus', evt => {
+        on(this.boundInput, 'focus', (evt) => {
           evt.target.select();
         })
       );
       // workaround for safari
       this.manage(
-        on(this.boundInput, 'mouseup', evt => {
+        on(this.boundInput, 'mouseup', (evt) => {
           evt.preventDefault();
         })
       );
@@ -75,7 +75,7 @@ class Slider extends mixin(
       })
     );
     this.manage(
-      on(this.element.ownerDocument, 'mousemove', evt => {
+      on(this.element.ownerDocument, 'mousemove', (evt) => {
         const disabled = this.element.classList.contains(
           this.options.classDisabled
         );
@@ -85,7 +85,7 @@ class Slider extends mixin(
       })
     );
     this.manage(
-      on(this.thumb, 'keydown', evt => {
+      on(this.thumb, 'keydown', (evt) => {
         const disabled = this.element.classList.contains(
           this.options.classDisabled
         );
@@ -95,7 +95,7 @@ class Slider extends mixin(
       })
     );
     this.manage(
-      on(this.track, 'click', evt => {
+      on(this.track, 'click', (evt) => {
         const disabled = this.element.classList.contains(
           this.options.classDisabled
         );
@@ -122,8 +122,9 @@ class Slider extends mixin(
     requestAnimationFrame(() => {
       this.dragging = false;
       this.thumb.style.left = `${left}%`;
-      this.filledTrack.style.transform = `translate(0%, -50%) scaleX(${left /
-        100})`;
+      this.filledTrack.style.transform = `translate(0%, -50%) scaleX(${
+        left / 100
+      })`;
       this.input.value = newValue;
       this._updateInput();
       this.changeState('slider-value-change', { value: newValue });
diff --git a/packages/components/src/components/structured-list/structured-list.js b/packages/components/src/components/structured-list/structured-list.js
index 957dd9b1c25e..f1e5e8e18820 100644
--- a/packages/components/src/components/structured-list/structured-list.js
+++ b/packages/components/src/components/structured-list/structured-list.js
@@ -13,7 +13,7 @@ import handles from '../../globals/js/mixins/handles';
 import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class StructuredList extends mixin(
   createComponent,
@@ -33,7 +33,7 @@ class StructuredList extends mixin(
   constructor(element, options) {
     super(element, options);
     this.manage(
-      on(this.element, 'keydown', evt => {
+      on(this.element, 'keydown', (evt) => {
         if (
           evt.which === 37 ||
           evt.which === 38 ||
@@ -48,7 +48,7 @@ class StructuredList extends mixin(
       })
     );
     this.manage(
-      on(this.element, 'click', evt => {
+      on(this.element, 'click', (evt) => {
         this._handleClick(evt);
       })
     );
@@ -86,7 +86,7 @@ class StructuredList extends mixin(
     const selectedRow = eventMatches(evt, this.options.selectorRow);
     toArray(
       this.element.querySelectorAll(this.options.selectorRow)
-    ).forEach(row => row.classList.remove(this.options.classActive));
+    ).forEach((row) => row.classList.remove(this.options.classActive));
     if (selectedRow) {
       selectedRow.classList.add(this.options.classActive);
     }
@@ -98,7 +98,7 @@ class StructuredList extends mixin(
     const selectedRow = eventMatches(evt, this.options.selectorRow);
     toArray(
       this.element.querySelectorAll(this.options.selectorRow)
-    ).forEach(row => row.classList.remove(this.options.classActive));
+    ).forEach((row) => row.classList.remove(this.options.classActive));
     if (selectedRow) {
       selectedRow.classList.add(this.options.classActive);
       const input =
@@ -119,7 +119,7 @@ class StructuredList extends mixin(
       const rows = toArray(
         this.element.querySelectorAll(this.options.selectorRow)
       );
-      rows.forEach(row => row.classList.remove(this.options.classActive));
+      rows.forEach((row) => row.classList.remove(this.options.classActive));
       const firstIndex = 0;
       const nextIndex = this._nextIndex(rows, selectedRow, direction);
       const lastIndex = rows.length - 1;
@@ -147,7 +147,7 @@ class StructuredList extends mixin(
     return {
       selectorInit: '[data-structured-list]',
       selectorRow: `[data-structured-list] .${prefix}--structured-list-tbody > label.${prefix}--structured-list-row`,
-      selectorListInput: id => `#${id}.${prefix}--structured-list-input`,
+      selectorListInput: (id) => `#${id}.${prefix}--structured-list-input`,
       classActive: `${prefix}--structured-list-row--selected`,
     };
   }
diff --git a/packages/components/src/components/tabs/tabs.config.js b/packages/components/src/components/tabs/tabs.config.js
index f1d86d3deabb..da0a3e44780d 100644
--- a/packages/components/src/components/tabs/tabs.config.js
+++ b/packages/components/src/components/tabs/tabs.config.js
@@ -9,7 +9,7 @@
 
 const { prefix } = require('../../globals/js/settings');
 
-const items = idSuffix => [
+const items = (idSuffix) => [
   {
     linkId: `tab-link-1-${idSuffix}`,
     panelId: `tab-panel-1-${idSuffix}`,
diff --git a/packages/components/src/components/tabs/tabs.js b/packages/components/src/components/tabs/tabs.js
index 06c6ec6fc59e..a09308287b0a 100644
--- a/packages/components/src/components/tabs/tabs.js
+++ b/packages/components/src/components/tabs/tabs.js
@@ -10,7 +10,7 @@ import eventMatches from '../../globals/js/misc/event-matches';
 import ContentSwitcher from '../content-switcher/content-switcher';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class Tab extends ContentSwitcher {
   /**
@@ -36,12 +36,12 @@ class Tab extends ContentSwitcher {
     super(element, options);
 
     this.manage(
-      on(this.element, 'keydown', event => {
+      on(this.element, 'keydown', (event) => {
         this._handleKeyDown(event);
       })
     );
     this.manage(
-      on(this.element.ownerDocument, 'click', event => {
+      on(this.element.ownerDocument, 'click', (event) => {
         this._handleDocumentClick(event);
       })
     );
diff --git a/packages/components/src/components/text-input/text-input.js b/packages/components/src/components/text-input/text-input.js
index 69b5fe290abd..28834654b796 100644
--- a/packages/components/src/components/text-input/text-input.js
+++ b/packages/components/src/components/text-input/text-input.js
@@ -28,7 +28,7 @@ export default class TextInput extends mixin(
   constructor(element, options) {
     super(element, options);
     this.manage(
-      on(this.element, 'click', event => {
+      on(this.element, 'click', (event) => {
         const toggleVisibilityButton = eventMatches(
           event,
           this.options.selectorPasswordVisibilityButton
diff --git a/packages/components/src/components/tile/tile.js b/packages/components/src/components/tile/tile.js
index b95b715b6d78..c59bcf950ed1 100644
--- a/packages/components/src/components/tile/tile.js
+++ b/packages/components/src/components/tile/tile.js
@@ -26,7 +26,7 @@ class Tile extends mixin(createComponent, initComponentBySearch) {
     this._hookActions(this._getClass(this.tileType));
   }
 
-  _getClass = type => {
+  _getClass = (type) => {
     const typeObj = {
       expandable: this.options.classExpandedTile,
       clickable: this.options.classClickableTile,
@@ -35,7 +35,7 @@ class Tile extends mixin(createComponent, initComponentBySearch) {
     return typeObj[type];
   };
 
-  _hookActions = tileClass => {
+  _hookActions = (tileClass) => {
     const isExpandable = this.tileType === 'expandable';
     if (isExpandable) {
       const aboveTheFold = this.element.querySelector(
@@ -66,7 +66,7 @@ class Tile extends mixin(createComponent, initComponentBySearch) {
       }
     }
 
-    this.element.addEventListener('click', evt => {
+    this.element.addEventListener('click', (evt) => {
       const input = eventMatches(evt, this.options.selectorTileInput);
       if (!input) {
         this.element.classList.toggle(tileClass);
@@ -75,7 +75,7 @@ class Tile extends mixin(createComponent, initComponentBySearch) {
         this._setTileHeight();
       }
     });
-    this.element.addEventListener('keydown', evt => {
+    this.element.addEventListener('keydown', (evt) => {
       const input = this.element.querySelector(this.options.selectorTileInput);
       if (input) {
         if (evt.which === 13 || evt.which === 32) {
diff --git a/packages/components/src/components/toolbar/toolbar.js b/packages/components/src/components/toolbar/toolbar.js
index 4f3d3b5ec192..f0d4fdc6aa54 100644
--- a/packages/components/src/components/toolbar/toolbar.js
+++ b/packages/components/src/components/toolbar/toolbar.js
@@ -13,7 +13,7 @@ import handles from '../../globals/js/mixins/handles';
 import eventMatches from '../../globals/js/misc/event-matches';
 import on from '../../globals/js/misc/on';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class Toolbar extends mixin(createComponent, initComponentBySearch, handles) {
   /**
@@ -37,7 +37,7 @@ class Toolbar extends mixin(createComponent, initComponentBySearch, handles) {
       );
       if (rowHeightBtns) {
         this.manage(
-          on(rowHeightBtns, 'click', event => {
+          on(rowHeightBtns, 'click', (event) => {
             this._handleRowHeightChange(event, boundTable);
           })
         );
@@ -48,12 +48,12 @@ class Toolbar extends mixin(createComponent, initComponentBySearch, handles) {
     }
 
     this.manage(
-      on(this.element.ownerDocument, 'keydown', evt => {
+      on(this.element.ownerDocument, 'keydown', (evt) => {
         this._handleKeyDown(evt);
       })
     );
     this.manage(
-      on(this.element.ownerDocument, 'click', evt => {
+      on(this.element.ownerDocument, 'click', (evt) => {
         this._handleDocumentClick(evt);
       })
     );
@@ -87,7 +87,7 @@ class Toolbar extends mixin(createComponent, initComponentBySearch, handles) {
     );
     toArray(
       this.element.ownerDocument.querySelectorAll(this.options.selectorSearch)
-    ).forEach(item => {
+    ).forEach((item) => {
       if (!targetComponentElement || !targetComponentElement.contains(item)) {
         item.classList.remove(this.options.classSearchActive);
       }
diff --git a/packages/components/src/components/tooltip/tooltip--simple.js b/packages/components/src/components/tooltip/tooltip--simple.js
index 175086520dd6..01c7ec1fe4aa 100644
--- a/packages/components/src/components/tooltip/tooltip--simple.js
+++ b/packages/components/src/components/tooltip/tooltip--simple.js
@@ -29,7 +29,7 @@ export default class TooltipSimple extends mixin(
   constructor(element, options) {
     super(element, options);
     this.manage(
-      on(this.element.ownerDocument, 'keydown', event => {
+      on(this.element.ownerDocument, 'keydown', (event) => {
         // ESC
         if (event.which === 27) {
           this.allowTooltipVisibility({ visible: false });
@@ -54,7 +54,7 @@ export default class TooltipSimple extends mixin(
     );
     this.manage(on(this.element, 'mouseleave', this.tooltipFadeOut));
     this.manage(
-      on(this.element, 'focusin', event => {
+      on(this.element, 'focusin', (event) => {
         if (eventMatches(event, this.options.selectorTriggerButton)) {
           this.allowTooltipVisibility({ visible: true });
         }
diff --git a/packages/components/src/components/tooltip/tooltip.config.js b/packages/components/src/components/tooltip/tooltip.config.js
index f5d21fca84b3..ef6e8a7e8b4a 100644
--- a/packages/components/src/components/tooltip/tooltip.config.js
+++ b/packages/components/src/components/tooltip/tooltip.config.js
@@ -24,19 +24,13 @@ module.exports = {
       `,
       context: {
         noHeading: {
-          idSuffix: `example-${Math.random()
-            .toString(36)
-            .substr(2)}`,
+          idSuffix: `example-${Math.random().toString(36).substr(2)}`,
         },
         heading: {
-          idSuffix: `example-${Math.random()
-            .toString(36)
-            .substr(2)}`,
+          idSuffix: `example-${Math.random().toString(36).substr(2)}`,
         },
         label: {
-          idSuffix: `example-${Math.random()
-            .toString(36)
-            .substr(2)}`,
+          idSuffix: `example-${Math.random().toString(36).substr(2)}`,
         },
       },
     },
diff --git a/packages/components/src/components/tooltip/tooltip.js b/packages/components/src/components/tooltip/tooltip.js
index 31698c78b538..5a21a5bff289 100644
--- a/packages/components/src/components/tooltip/tooltip.js
+++ b/packages/components/src/components/tooltip/tooltip.js
@@ -59,7 +59,7 @@ const getMenuOffset = (menuBody, menuDirection) => {
     );
   }
   values[arrowPositionProp] = values[arrowPositionProp] || -6; // IE, etc.
-  if (Object.keys(values).every(name => !isNaN(values[name]))) {
+  if (Object.keys(values).every((name) => !isNaN(values[name]))) {
     const {
       [arrowPositionProp]: arrowPosition,
       'border-bottom-width': borderBottomWidth,
@@ -191,7 +191,7 @@ class Tooltip extends mixin(
         on(
           this.element,
           'keydown',
-          event => {
+          (event) => {
             handleClickContextMenu(event, allowedOpenKeys);
           },
           false
diff --git a/packages/components/src/components/ui-shell/header-nav.js b/packages/components/src/components/ui-shell/header-nav.js
index abbc1577d3c0..bc3dd61a487a 100644
--- a/packages/components/src/components/ui-shell/header-nav.js
+++ b/packages/components/src/components/ui-shell/header-nav.js
@@ -12,7 +12,7 @@ import handles from '../../globals/js/mixins/handles';
 import on from '../../globals/js/misc/on';
 import settings from '../../globals/js/settings';
 
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class HeaderNav extends mixin(createComponent, initComponentBySearch, handles) {
   /**
@@ -54,12 +54,12 @@ class HeaderNav extends mixin(createComponent, initComponentBySearch, handles) {
    * Moves the focus up/down.
    * @param {number} direction The direction of navigating.
    */
-  navigate = direction => {
+  navigate = (direction) => {
     const items = toArray(
       this.element.querySelectorAll(this.options.selectorSubmenuLink)
     );
     const start = this.getCurrentNavigation();
-    const getNextItem = old => {
+    const getNextItem = (old) => {
       const handleUnderflow = (index, length) =>
         index + (index >= 0 ? 0 : length);
       const handleOverflow = (index, length) =>
@@ -78,7 +78,7 @@ class HeaderNav extends mixin(createComponent, initComponentBySearch, handles) {
    * Handles keydown event.
    * @param {Event} event The event triggering this method.
    */
-  _handleKeyDown = event => {
+  _handleKeyDown = (event) => {
     const keyCodes = {
       37: this.constructor.NAVIGATE.BACKWARD, // left arrow
       39: this.constructor.NAVIGATE.FORWARD, // right arrow
diff --git a/packages/components/src/components/ui-shell/header-submenu.js b/packages/components/src/components/ui-shell/header-submenu.js
index 8db6c2a90fbd..761d6ae27d12 100644
--- a/packages/components/src/components/ui-shell/header-submenu.js
+++ b/packages/components/src/components/ui-shell/header-submenu.js
@@ -14,7 +14,7 @@ import settings from '../../globals/js/settings';
 import eventMatches from '../../globals/js/misc/event-matches';
 
 const forEach = /* #__PURE__ */ (() => Array.prototype.forEach)();
-const toArray = arrayLike => Array.prototype.slice.call(arrayLike);
+const toArray = (arrayLike) => Array.prototype.slice.call(arrayLike);
 
 class HeaderSubmenu extends mixin(
   createComponent,
@@ -71,7 +71,7 @@ class HeaderSubmenu extends mixin(
   /**
    * @returns {actions | null}
    */
-  _getAction = event => {
+  _getAction = (event) => {
     const isFlyoutMenu = eventMatches(event, this.options.selectorFlyoutMenu);
     if (isFlyoutMenu) {
       return this.constructor.actions.DELEGATE_TO_FLYOUT_MENU;
@@ -107,7 +107,7 @@ class HeaderSubmenu extends mixin(
    * @param {action} action
    * @returns {boolean} new header submenu state
    */
-  _getNewState = action => {
+  _getNewState = (action) => {
     const trigger = this.element.querySelector(this.options.selectorTrigger);
     const isExpanded =
       trigger.getAttribute(this.options.attribExpanded) === 'true';
@@ -132,7 +132,7 @@ class HeaderSubmenu extends mixin(
     trigger.setAttribute(this.options.attribExpanded, shouldBeExpanded);
     forEach.call(
       this.element.querySelectorAll(this.options.selectorItem),
-      item => {
+      (item) => {
         item.tabIndex = shouldBeExpanded ? 0 : -1;
       }
     );
@@ -158,14 +158,14 @@ class HeaderSubmenu extends mixin(
    * Moves the focus up/down.
    * @param {number} direction The direction of navigating.
    */
-  navigate = direction => {
+  navigate = (direction) => {
     const items = toArray(
       this.element.querySelectorAll(this.options.selectorItem)
     );
     const start =
       this.getCurrentNavigation() ||
       this.element.querySelector(this.options.selectorItemSelected);
-    const getNextItem = old => {
+    const getNextItem = (old) => {
       const handleUnderflow = (index, length) =>
         index + (index >= 0 ? 0 : length);
       const handleOverflow = (index, length) =>
@@ -193,7 +193,7 @@ class HeaderSubmenu extends mixin(
     }
   };
 
-  _handleEvent = event => {
+  _handleEvent = (event) => {
     const trigger = this.element.querySelector(this.options.selectorTrigger);
     if (!trigger) {
       return;
@@ -209,7 +209,7 @@ class HeaderSubmenu extends mixin(
    * Handles keydown event.
    * @param {Event} event The event triggering this method.
    */
-  _handleKeyDown = event => {
+  _handleKeyDown = (event) => {
     const trigger = this.element.querySelector(this.options.selectorTrigger);
     if (!trigger) {
       return;
diff --git a/packages/components/src/components/ui-shell/navigation-menu-panel.js b/packages/components/src/components/ui-shell/navigation-menu-panel.js
index dc90f9bb0b4e..36f28db7644e 100644
--- a/packages/components/src/components/ui-shell/navigation-menu-panel.js
+++ b/packages/components/src/components/ui-shell/navigation-menu-panel.js
@@ -21,7 +21,7 @@ export default class NavigationMenuPanel extends mixin(
   handles,
   eventedState
 ) {
-  createdByLauncher = event => {
+  createdByLauncher = (event) => {
     const isExpanded = !this.element.hasAttribute('hidden');
     const newState = isExpanded ? 'collapsed' : 'expanded';
     this.triggerButton = event.delegateTarget;
@@ -34,7 +34,7 @@ export default class NavigationMenuPanel extends mixin(
    * @param {string} state
    * @returns {boolean} true if given state is different from current state
    */
-  shouldStateBeChanged = state =>
+  shouldStateBeChanged = (state) =>
     (state === 'expanded') === this.element.hasAttribute('hidden');
 
   /**
diff --git a/packages/components/src/components/ui-shell/navigation-menu.js b/packages/components/src/components/ui-shell/navigation-menu.js
index 7d82bd9b283a..fcc24fc2b054 100644
--- a/packages/components/src/components/ui-shell/navigation-menu.js
+++ b/packages/components/src/components/ui-shell/navigation-menu.js
@@ -42,7 +42,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
     this.manage(on(element, 'click', this._handleClick));
     this.manage(on(element, 'keydown', this._handleKeyDown));
     this.manage(
-      on(this.element.ownerDocument, 'click', event => {
+      on(this.element.ownerDocument, 'click', (event) => {
         if (
           !this.element.hasAttribute('hidden') &&
           !this.triggerButton.contains(event.target) &&
@@ -72,12 +72,12 @@ export default class NavigationMenu extends NavigationMenuPanel {
    * Moves the focus up/down.
    * @param {number} direction The direction of navigating.
    */
-  navigate = direction => {
+  navigate = (direction) => {
     const items = [
       ...this.element.querySelectorAll(this.options.selectorFocusableNavItems),
     ];
     const start = this.getCurrentNavigation();
-    const getNextItem = old => {
+    const getNextItem = (old) => {
       const handleUnderflow = (index, length) =>
         index + (index >= 0 ? 0 : length);
       const handleOverflow = (index, length) =>
@@ -98,7 +98,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
    * Esc closes the menu
    * @param {Event} event The event triggering this method.
    */
-  _handleKeyDown = event => {
+  _handleKeyDown = (event) => {
     // handle Esc
     const isExpanded = !this.element.hasAttribute('hidden');
     if (event.which === 27 && isExpanded) {
@@ -134,7 +134,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
   /**
    * @param {Event} event The event triggering this method
    */
-  _handleFocusOut = event => {
+  _handleFocusOut = (event) => {
     const nextTargetIsOfSelf =
       this.element.contains(event.relatedTarget) ||
       event.relatedTarget === this.triggerButton ||
@@ -159,7 +159,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
     );
     Array.prototype.forEach.call(
       shellNavCategory.querySelectorAll(this.options.selectorShellNavLink),
-      item => {
+      (item) => {
         item.tabIndex = !shouldBeCollapsed ? 0 : -1;
       }
     );
@@ -169,7 +169,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
    * toggle the state of the nav menu on click
    * @param {Event} event The event triggering this method
    */
-  _handleClick = event => {
+  _handleClick = (event) => {
     const matchesNavSubmenu = eventMatches(
       event,
       this.options.selectorShellNavSubmenu
@@ -190,7 +190,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
         ...this.element.querySelectorAll(
           this.options.selectorShellNavLinkCurrent
         ),
-      ].forEach(el => {
+      ].forEach((el) => {
         el.classList.remove(
           this.options.classShellNavItemActive,
           this.options.classShellNavLinkCurrent
@@ -212,7 +212,7 @@ export default class NavigationMenu extends NavigationMenuPanel {
         ...this.element.querySelectorAll(
           this.options.selectorShellNavLinkCurrent
         ),
-      ].forEach(el => {
+      ].forEach((el) => {
         el.classList.remove(
           this.options.classShellNavItemActive,
           this.options.classShellNavLinkCurrent
diff --git a/packages/components/src/components/ui-shell/product-switcher.js b/packages/components/src/components/ui-shell/product-switcher.js
index 2343c38da45b..056f2863514d 100644
--- a/packages/components/src/components/ui-shell/product-switcher.js
+++ b/packages/components/src/components/ui-shell/product-switcher.js
@@ -48,7 +48,7 @@ class ProductSwitcher extends NavigationMenuPanel {
    * trigger button
    * @param {Event} event The event triggering this method
    */
-  _handleFocusOut = event => {
+  _handleFocusOut = (event) => {
     if (this.element.contains(event.relatedTarget)) {
       return;
     }
@@ -67,7 +67,7 @@ class ProductSwitcher extends NavigationMenuPanel {
   /**
    * @param {Event} event The event triggering this method
    */
-  _handleKeyDown = event => {
+  _handleKeyDown = (event) => {
     const isExpanded = !this.element.hasAttribute('hidden');
     if (event.which === 27 && isExpanded) {
       const triggerButton = this.current;
@@ -76,7 +76,7 @@ class ProductSwitcher extends NavigationMenuPanel {
     }
   };
 
-  createdByLauncher = event => {
+  createdByLauncher = (event) => {
     const isExpanded = this.element.classList.contains(
       this.options.classProductSwitcherExpanded
     );
@@ -97,7 +97,7 @@ class ProductSwitcher extends NavigationMenuPanel {
    * @param {string} current
    * @returns {boolean} true if given state is different from current state
    */
-  shouldStateBeChanged = current => this.current !== current;
+  shouldStateBeChanged = (current) => this.current !== current;
 
   /**
    * Changes the expanded/collapsed state.
@@ -116,7 +116,7 @@ class ProductSwitcher extends NavigationMenuPanel {
     }
 
     // deactivate all other trigger buttons
-    this.triggerButtonIds.forEach(id => {
+    this.triggerButtonIds.forEach((id) => {
       const button = this.element.ownerDocument.getElementById(id);
       const label = button.getAttribute(this.options.attribLabelExpand);
       button.classList.remove(
diff --git a/packages/components/src/components/ui-shell/side-nav.js b/packages/components/src/components/ui-shell/side-nav.js
index 8ba847ed567b..8a8c00d92256 100644
--- a/packages/components/src/components/ui-shell/side-nav.js
+++ b/packages/components/src/components/ui-shell/side-nav.js
@@ -78,7 +78,7 @@ class SideNav extends mixin(createComponent, initComponentBySearch, handles) {
     );
   }
 
-  _handleClick = evt => {
+  _handleClick = (evt) => {
     const matchesToggle = eventMatches(evt, this.options.selectorSideNavToggle);
     const matchesNavSubmenu = eventMatches(
       evt,
@@ -110,7 +110,7 @@ class SideNav extends mixin(createComponent, initComponentBySearch, handles) {
         ...this.element.querySelectorAll(
           this.options.selectorSideNavLinkCurrent
         ),
-      ].forEach(el => {
+      ].forEach((el) => {
         el.classList.remove(
           this.options.classSideNavItemActive,
           this.options.classSideNavLinkCurrent
diff --git a/packages/components/src/components/ui-shell/ui-shell.config.js b/packages/components/src/components/ui-shell/ui-shell.config.js
index 661ddc2a9018..29f46053e3d1 100644
--- a/packages/components/src/components/ui-shell/ui-shell.config.js
+++ b/packages/components/src/components/ui-shell/ui-shell.config.js
@@ -82,9 +82,7 @@ const navigationMenu = {
       ],
     },
   ],
-  idSuffix: Math.random()
-    .toString(36)
-    .substr(2),
+  idSuffix: Math.random().toString(36).substr(2),
 };
 
 const switcher = {
@@ -124,9 +122,7 @@ const switcher = {
       title: 'All Products',
     },
   ],
-  idSuffix: Math.random()
-    .toString(36)
-    .substr(2),
+  idSuffix: Math.random().toString(36).substr(2),
 };
 
 const header = {
@@ -293,15 +289,13 @@ module.exports = {
             expanded: true,
             category: true,
           },
-          sections: navigationMenu.sections.map(section => ({
-            items: section.items.map(item => ({
+          sections: navigationMenu.sections.map((section) => ({
+            items: section.items.map((item) => ({
               ...item,
               hasIcon: false,
             })),
           })),
-          idSuffix: Math.random()
-            .toString(36)
-            .substr(2),
+          idSuffix: Math.random().toString(36).substr(2),
         },
       },
     },
diff --git a/packages/components/src/globals/js/boot.js b/packages/components/src/globals/js/boot.js
index 444409cb04b0..13dcbc13923f 100644
--- a/packages/components/src/globals/js/boot.js
+++ b/packages/components/src/globals/js/boot.js
@@ -25,10 +25,10 @@ const lazyInitHandles = [];
  */
 const init = () => {
   const componentClasses = Object.keys(components)
-    .map(key => components[key])
-    .filter(component => typeof component.init === 'function');
+    .map((key) => components[key])
+    .filter((component) => typeof component.init === 'function');
   if (!settings.disableAutoInit) {
-    componentClasses.forEach(Clz => {
+    componentClasses.forEach((Clz) => {
       const h = Clz.init();
       if (h) {
         lazyInitHandles.push(h);
@@ -41,7 +41,7 @@ const init = () => {
  * Replaces the list of components to initialize.
  * @param {object} componentsToReplaceWith The new list of components.
  */
-export const setComponents = componentsToReplaceWith => {
+export const setComponents = (componentsToReplaceWith) => {
   components = componentsToReplaceWith;
 };
 
diff --git a/packages/components/src/globals/js/misc/on-focus-by-keyboard.js b/packages/components/src/globals/js/misc/on-focus-by-keyboard.js
index c246298be1c0..948930c8ab62 100644
--- a/packages/components/src/globals/js/misc/on-focus-by-keyboard.js
+++ b/packages/components/src/globals/js/misc/on-focus-by-keyboard.js
@@ -28,7 +28,7 @@ export default function onFocusByKeyboard(node, name, callback) {
       clicked = false;
     });
   };
-  let handleFocusin = evt => {
+  let handleFocusin = (evt) => {
     if (!clicked) {
       callback(evt);
     }
diff --git a/packages/components/src/globals/js/misc/resize.js b/packages/components/src/globals/js/misc/resize.js
index d4b70d31d462..5855acd76b97 100644
--- a/packages/components/src/globals/js/misc/resize.js
+++ b/packages/components/src/globals/js/misc/resize.js
@@ -13,7 +13,7 @@ const optimizedResize = /* #__PURE__ */ (function optimizedResize() {
 
   // run the actual callbacks
   function runCallbacks() {
-    callbacks.forEach(callback => {
+    callbacks.forEach((callback) => {
       callback();
     });
 
@@ -40,7 +40,7 @@ const optimizedResize = /* #__PURE__ */ (function optimizedResize() {
 
   return {
     // public method to add additional callback
-    add: callback => {
+    add: (callback) => {
       if (!callbacks.length) {
         window.addEventListener('resize', resize);
       }
diff --git a/packages/components/src/globals/js/misc/svg-toggle-class.js b/packages/components/src/globals/js/misc/svg-toggle-class.js
index 8ab177ae3c83..a591c64e6c0f 100644
--- a/packages/components/src/globals/js/misc/svg-toggle-class.js
+++ b/packages/components/src/globals/js/misc/svg-toggle-class.js
@@ -6,10 +6,7 @@
  */
 
 function svgToggleClass(svg, name, forceAdd) {
-  const list = svg
-    .getAttribute('class')
-    .trim()
-    .split(/\s+/);
+  const list = svg.getAttribute('class').trim().split(/\s+/);
   const uniqueList = Object.keys(
     list.reduce((o, item) => Object.assign(o, { [item]: 1 }), {})
   );
diff --git a/packages/components/src/globals/js/mixins/create-component.js b/packages/components/src/globals/js/mixins/create-component.js
index 03e3d6ca9cd1..a776c8ece3f6 100644
--- a/packages/components/src/globals/js/mixins/create-component.js
+++ b/packages/components/src/globals/js/mixins/create-component.js
@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-export default function(ToMix) {
+export default function (ToMix) {
   class CreateComponent extends ToMix {
     /**
      * The component instances managed by this component.
diff --git a/packages/components/src/globals/js/mixins/evented-state.js b/packages/components/src/globals/js/mixins/evented-state.js
index be70c2198d17..5dc0a948ff18 100644
--- a/packages/components/src/globals/js/mixins/evented-state.js
+++ b/packages/components/src/globals/js/mixins/evented-state.js
@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-export default function(ToMix) {
+export default function (ToMix) {
   /**
    * Mix-in class to manage events associated with states.
    * @class EventedState
@@ -62,7 +62,7 @@ export default function(ToMix) {
         .filter(Boolean)
         .join('-')
         .split('-') // Group or state may contain hyphen
-        .map(item => item[0].toUpperCase() + item.substr(1))
+        .map((item) => item[0].toUpperCase() + item.substr(1))
         .join('');
 
       const eventStart = new CustomEvent(
diff --git a/packages/components/src/globals/js/mixins/handles.js b/packages/components/src/globals/js/mixins/handles.js
index 7abff04f6819..5fe88f50a22a 100644
--- a/packages/components/src/globals/js/mixins/handles.js
+++ b/packages/components/src/globals/js/mixins/handles.js
@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-export default function(ToMix) {
+export default function (ToMix) {
   /**
    * Mix-in class to manage handles in component.
    * Managed handles are automatically released when the component with this class mixed in is released.
@@ -41,7 +41,7 @@ export default function(ToMix) {
     }
 
     release() {
-      this.handles.forEach(handle => {
+      this.handles.forEach((handle) => {
         handle.release();
         this.handles.delete(handle);
       });
diff --git a/packages/components/src/globals/js/mixins/init-component-by-event.js b/packages/components/src/globals/js/mixins/init-component-by-event.js
index a57545555a2f..ca599ca1a02d 100644
--- a/packages/components/src/globals/js/mixins/init-component-by-event.js
+++ b/packages/components/src/globals/js/mixins/init-component-by-event.js
@@ -8,7 +8,7 @@
 import eventMatches from '../misc/event-matches';
 import on from '../misc/on';
 
-export default function(ToMix) {
+export default function (ToMix) {
   /**
    * Mix-in class to instantiate components upon events.
    * @class InitComponentByEvent
@@ -56,12 +56,12 @@ export default function(ToMix) {
             ? target.ownerDocument
             : target
           ).defaultView;
-        const handles = effectiveOptions.initEventNames.map(name => {
+        const handles = effectiveOptions.initEventNames.map((name) => {
           const eventName = name === 'focus' && hasFocusin ? 'focusin' : name;
           return on(
             target,
             eventName,
-            event => {
+            (event) => {
               const element = eventMatches(
                 event,
                 effectiveOptions.selectorInit
diff --git a/packages/components/src/globals/js/mixins/init-component-by-launcher.js b/packages/components/src/globals/js/mixins/init-component-by-launcher.js
index 5a05cc72441a..1edc1f50e81a 100644
--- a/packages/components/src/globals/js/mixins/init-component-by-launcher.js
+++ b/packages/components/src/globals/js/mixins/init-component-by-launcher.js
@@ -8,7 +8,7 @@
 import eventMatches from '../misc/event-matches';
 import on from '../misc/on';
 
-export default function(ToMix) {
+export default function (ToMix) {
   /**
    * Mix-in class to instantiate components events on launcher button.
    * @class InitComponentByLauncher
@@ -51,8 +51,8 @@ export default function(ToMix) {
       ) {
         this.create(target, options);
       } else {
-        const handles = effectiveOptions.initEventNames.map(name =>
-          on(target, name, event => {
+        const handles = effectiveOptions.initEventNames.map((name) =>
+          on(target, name, (event) => {
             const launcher = eventMatches(
               event,
               `[${effectiveOptions.attribInitTarget}]`
diff --git a/packages/components/src/globals/js/mixins/init-component-by-search.js b/packages/components/src/globals/js/mixins/init-component-by-search.js
index 6c5098a3c7a6..637b4f6d63f1 100644
--- a/packages/components/src/globals/js/mixins/init-component-by-search.js
+++ b/packages/components/src/globals/js/mixins/init-component-by-search.js
@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-export default function(ToMix) {
+export default function (ToMix) {
   /**
    * Mix-in class to instantiate components by searching for their root elements.
    * @class InitComponentBySearch
@@ -41,7 +41,7 @@ export default function(ToMix) {
       } else {
         Array.prototype.forEach.call(
           target.querySelectorAll(effectiveOptions.selectorInit),
-          element => this.create(element, options)
+          (element) => this.create(element, options)
         );
       }
     }
diff --git a/packages/components/src/globals/js/mixins/track-blur.js b/packages/components/src/globals/js/mixins/track-blur.js
index d9ffe6091db2..33d7b1da09f4 100644
--- a/packages/components/src/globals/js/mixins/track-blur.js
+++ b/packages/components/src/globals/js/mixins/track-blur.js
@@ -25,7 +25,7 @@ function trackBlur(ToMix) {
         on(
           this.element.ownerDocument,
           focusinEventName,
-          event => {
+          (event) => {
             if (
               !(this.options.contentNode || this.element).contains(event.target)
             ) {
@@ -39,7 +39,7 @@ function trackBlur(ToMix) {
         on(
           this.element.ownerDocument,
           focusoutEventName,
-          event => {
+          (event) => {
             if (!event.relatedTarget) {
               this.handleBlur(event);
             }
diff --git a/packages/components/src/globals/js/watch.js b/packages/components/src/globals/js/watch.js
index bdf62c73bb33..dc44805ff203 100644
--- a/packages/components/src/globals/js/watch.js
+++ b/packages/components/src/globals/js/watch.js
@@ -15,17 +15,17 @@ const createAndReleaseComponentsUponDOMMutation = (
   componentClassesForWatchInit,
   options
 ) => {
-  records.forEach(record => {
-    forEach.call(record.addedNodes, node => {
+  records.forEach((record) => {
+    forEach.call(record.addedNodes, (node) => {
       if (node.nodeType === Node.ELEMENT_NODE) {
-        componentClassesForWatchInit.forEach(Clz => {
+        componentClassesForWatchInit.forEach((Clz) => {
           Clz.init(node, options);
         });
       }
     });
-    forEach.call(record.removedNodes, node => {
+    forEach.call(record.removedNodes, (node) => {
       if (node.nodeType === Node.ELEMENT_NODE) {
-        componentClasses.forEach(Clz => {
+        componentClasses.forEach((Clz) => {
           if (node.matches(Clz.options.selectorInit)) {
             const instance = Clz.components.get(node);
             if (instance) {
@@ -34,7 +34,7 @@ const createAndReleaseComponentsUponDOMMutation = (
           } else {
             forEach.call(
               node.querySelectorAll(Clz.options.selectorInit),
-              element => {
+              (element) => {
                 const instance = Clz.components.get(element);
                 if (instance) {
                   instance.release();
@@ -54,7 +54,7 @@ const createAndReleaseComponentsUponDOMMutation = (
  * @param {object} [options] The component options.
  * @returns {Handle} The handle to stop watching.
  */
-export default function(target = document, options = {}) {
+export default function (target = document, options = {}) {
   if (
     target.nodeType !== Node.ELEMENT_NODE &&
     target.nodeType !== Node.DOCUMENT_NODE
@@ -65,18 +65,18 @@ export default function(target = document, options = {}) {
   }
 
   const componentClasses = Object.keys(components)
-    .map(key => components[key])
-    .filter(component => typeof component.init === 'function');
+    .map((key) => components[key])
+    .filter((component) => typeof component.init === 'function');
 
   const handles = componentClasses
-    .map(Clz => Clz.init(target, options))
+    .map((Clz) => Clz.init(target, options))
     .filter(Boolean);
 
   const componentClassesForWatchInit = componentClasses.filter(
-    Clz => !Clz.forLazyInit
+    (Clz) => !Clz.forLazyInit
   );
 
-  let observer = new MutationObserver(records => {
+  let observer = new MutationObserver((records) => {
     createAndReleaseComponentsUponDOMMutation(
       records,
       componentClasses,
diff --git a/packages/components/src/globals/scss/__tests__/component-tokens-test.js b/packages/components/src/globals/scss/__tests__/component-tokens-test.js
index b402b4a8de38..da3746cb8eae 100644
--- a/packages/components/src/globals/scss/__tests__/component-tokens-test.js
+++ b/packages/components/src/globals/scss/__tests__/component-tokens-test.js
@@ -62,7 +62,7 @@ describe('_component-tokens.scss', () => {
       }
     `);
 
-    const values = calls.map(call => convert(call[0]));
+    const values = calls.map((call) => convert(call[0]));
     expect(values[0]).toBe('#ffffff');
     expect(values[1]).toBe('#000000');
     expect(values[2]).toBe('#ffffff');
diff --git a/packages/components/src/globals/scss/__tests__/motion-test.js b/packages/components/src/globals/scss/__tests__/motion-test.js
index 90885113d77e..0b698f0cef43 100644
--- a/packages/components/src/globals/scss/__tests__/motion-test.js
+++ b/packages/components/src/globals/scss/__tests__/motion-test.js
@@ -20,7 +20,7 @@ const variables = [
 const render = createSassRenderer(__dirname);
 
 describe('motion', () => {
-  describe.each(variables)('$%s', name => {
+  describe.each(variables)('$%s', (name) => {
     // Temporarily test for regression since these variables were initially
     // under _vars.scss
     it('should be exported through _vars.scss', async () => {
diff --git a/packages/components/src/globals/scss/__tests__/themes-test.js b/packages/components/src/globals/scss/__tests__/themes-test.js
index 31cbd23d6181..21500e7a8ba9 100644
--- a/packages/components/src/globals/scss/__tests__/themes-test.js
+++ b/packages/components/src/globals/scss/__tests__/themes-test.js
@@ -175,7 +175,7 @@ describe('_theme.scss', () => {
     expect(convert(calls[3][0])).toBe(testColor);
   });
 
-  it.each(classic)('$%s should be exported', async name => {
+  it.each(classic)('$%s should be exported', async (name) => {
     const { calls } = await render(`
       @import '../theme';
       $c: test(global-variable-exists(${name}));
diff --git a/packages/components/src/globals/scss/__tests__/typography-test.js b/packages/components/src/globals/scss/__tests__/typography-test.js
index 0f5f18c972bc..fd5fef6221c4 100644
--- a/packages/components/src/globals/scss/__tests__/typography-test.js
+++ b/packages/components/src/globals/scss/__tests__/typography-test.js
@@ -14,7 +14,7 @@ const variables = ['base-font-size'];
 const render = createSassRenderer(__dirname);
 
 describe('_typography.scss', () => {
-  describe.each(variables)('$%s', name => {
+  describe.each(variables)('$%s', (name) => {
     it('should be exported', async () => {
       const { calls } = await render(`
 @import '../typography';
diff --git a/packages/components/tests/karma.conf.js b/packages/components/tests/karma.conf.js
index f78393feb74d..39b69d3ebe3a 100644
--- a/packages/components/tests/karma.conf.js
+++ b/packages/components/tests/karma.conf.js
@@ -3,7 +3,7 @@
 const path = require('path');
 const commander = require('commander');
 
-const flatten = a =>
+const flatten = (a) =>
   a.reduce(
     (result, item) => [...result, ...(Array.isArray(item) ? item : [item])],
     []
@@ -64,7 +64,7 @@ class FeatureFlagProxyPlugin {
   }
 }
 
-module.exports = function(config) {
+module.exports = function (config) {
   config.set({
     basePath: '..',
 
@@ -260,7 +260,7 @@ module.exports = function(config) {
       (cloptions.browser.length === 0
         ? ['ChromeHeadless']
         : cloptions.browser
-      ).map(browser => {
+      ).map((browser) => {
         const browserLower = browser.toLowerCase();
         return (process.env.TRAVIS && travisLaunchers[browserLower]) || browser;
       })
diff --git a/packages/components/tests/pure-modules-test.js b/packages/components/tests/pure-modules-test.js
index 22189e44d089..c1caa58fca0f 100644
--- a/packages/components/tests/pure-modules-test.js
+++ b/packages/components/tests/pure-modules-test.js
@@ -80,7 +80,7 @@ describe('ES modules', () => {
     lodashOutput = (await lodashBundle.generate({ format: 'iife' })).output;
   });
 
-  it.each(files)('%s should be tree-shakable', async relativeFilePath => {
+  it.each(files)('%s should be tree-shakable', async (relativeFilePath) => {
     const filepath = path.join(cwd, relativeFilePath);
     const bundle = await rollup({
       input: entry,
@@ -112,12 +112,12 @@ describe('ES modules', () => {
     const { output } = await bundle.generate({ format: 'iife' });
     // lo-dash seems to remain small chunk of code after tree-shaken
     const code = output
-      .map(item => item.code)
+      .map((item) => item.code)
       .join('')
       .trim()
       .replace(
         lodashOutput
-          .map(item => item.code)
+          .map((item) => item.code)
           .join('')
           .trim(),
         ''
diff --git a/packages/components/tests/spec/accordion_spec.js b/packages/components/tests/spec/accordion_spec.js
index d0148d03e19a..5a6dcd0133dc 100644
--- a/packages/components/tests/spec/accordion_spec.js
+++ b/packages/components/tests/spec/accordion_spec.js
@@ -3,18 +3,18 @@ import HTML from '../../html/accordion/accordion.html';
 import LegacyHTML from '../../html/accordion/accordion--legacy.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test accordion', function() {
-  describe('Constructor', function() {
+describe('Test accordion', function () {
+  describe('Constructor', function () {
     let instance;
     const container = document.createElement('div');
     container.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       instance = new Accordion(document.querySelector('[data-accordion]'));
     });
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Accordion();
       }).toThrowError(
@@ -23,7 +23,7 @@ describe('Test accordion', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Accordion(document.createTextNode(''));
       }).toThrowError(
@@ -32,7 +32,7 @@ describe('Test accordion', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       expect(flattenOptions(instance.options)).toEqual({
         selectorInit: '[data-accordion]',
         selectorAccordionItem: '.bx--accordion__item',
@@ -42,7 +42,7 @@ describe('Test accordion', function() {
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (document.body.contains(container)) {
         document.body.removeChild(container);
       }
@@ -54,27 +54,27 @@ describe('Test accordion', function() {
   // button, that's also enter + space. Keydown/keypress won't
   // trigger the event listener, as it's a different event
 
-  describe('Clicking list item', function() {
+  describe('Clicking list item', function () {
     let listItem;
     let buttonItem;
     const container = document.createElement('div');
     container.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       new Accordion(document.querySelector('[data-accordion]'));
       listItem = document.querySelector('[data-accordion-item]');
       buttonItem = listItem.querySelector('.bx--accordion__heading');
     });
 
-    it('Should set active state on click', function() {
+    it('Should set active state on click', function () {
       buttonItem.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(listItem.classList.contains('bx--accordion__item--active')).toBe(
         true
       );
     });
 
-    it('Should remove active state on second click', function() {
+    it('Should remove active state on second click', function () {
       listItem.classList.add('bx--accordion__item--active');
       buttonItem.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(listItem.classList.contains('bx--accordion__item--active')).toBe(
@@ -82,7 +82,7 @@ describe('Test accordion', function() {
       );
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (document.body.contains(container)) {
         document.body.removeChild(container);
       }
@@ -90,19 +90,19 @@ describe('Test accordion', function() {
   });
 
   // Only to ensure old markup still works as normal
-  describe('Keypress legacy list item', function() {
+  describe('Keypress legacy list item', function () {
     let accordion; //eslint-disable-line
     let listItem;
     const container = document.createElement('div');
     container.innerHTML = LegacyHTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       accordion = new Accordion(document.querySelector('[data-accordion]'));
       listItem = document.querySelector('[data-accordion-item]');
     });
 
-    it('Should not set active state on other keypress', function() {
+    it('Should not set active state on other keypress', function () {
       const event = new CustomEvent('keypress', { bubbles: true });
       event.which = 86;
       listItem.dispatchEvent(event);
@@ -111,7 +111,7 @@ describe('Test accordion', function() {
       );
     });
 
-    it('Should set active state on enter or spacebar press', function() {
+    it('Should set active state on enter or spacebar press', function () {
       const event = new CustomEvent('keypress', { bubbles: true });
       event.which = 13;
       listItem.dispatchEvent(event);
@@ -120,7 +120,7 @@ describe('Test accordion', function() {
       );
     });
 
-    it('Should remove active state on second enter or spacebar press', function() {
+    it('Should remove active state on second enter or spacebar press', function () {
       listItem.classList.add('bx--accordion__item--active');
       const event = new CustomEvent('keypress', { bubbles: true });
       event.which = 13;
@@ -130,11 +130,11 @@ describe('Test accordion', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       listItem.classList.remove('bx--accordion__item--active');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       accordion.release();
       document.body.removeChild(container);
     });
diff --git a/packages/components/tests/spec/checkbox_spec.js b/packages/components/tests/spec/checkbox_spec.js
index a543dfe79ffd..ef7eea7c6bbc 100644
--- a/packages/components/tests/spec/checkbox_spec.js
+++ b/packages/components/tests/spec/checkbox_spec.js
@@ -2,13 +2,13 @@ import Checkbox from '../../src/components/checkbox/checkbox';
 import HTML from '../../html/checkbox/checkbox.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test Checkbox', function() {
-  describe('Constructor', function() {
+describe('Test Checkbox', function () {
+  describe('Constructor', function () {
     let element;
     let instance;
     let container;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -16,7 +16,7 @@ describe('Test Checkbox', function() {
       instance = new Checkbox(element);
     });
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Checkbox();
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('Test Checkbox', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Checkbox(document.createTextNode(''));
       }).toThrowError(
@@ -34,7 +34,7 @@ describe('Test Checkbox', function() {
       );
     });
 
-    it('should set default options', function() {
+    it('should set default options', function () {
       expect(flattenOptions(instance.options)).toEqual({
         selectorInit: '.bx--checkbox',
         selectorContainedCheckboxState: '[data-contained-checkbox-state]',
@@ -46,18 +46,18 @@ describe('Test Checkbox', function() {
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       instance.release();
     });
   });
 
-  describe('Test Checkbox', function() {
+  describe('Test Checkbox', function () {
     let container;
     let elem;
     let checkbox;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       elem = document.createElement('input');
       elem.setAttribute('type', 'checkbox');
@@ -65,7 +65,7 @@ describe('Test Checkbox', function() {
       checkbox = Checkbox.create(elem);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       container.classList.add('bx--checkbox-label');
       container.setAttribute('data-contained-checkbox-state', 'false');
       elem.setAttribute('aria-checked', 'false');
@@ -74,40 +74,40 @@ describe('Test Checkbox', function() {
       elem.indeterminate = false;
     });
 
-    it('setState should support mixed state', function() {
+    it('setState should support mixed state', function () {
       checkbox.setState('mixed');
       expect(elem.indeterminate, 'indeterminate on element').toBe(true);
       expect(elem.checked, 'checked prop on element').toBe(false);
       expect(elem.getAttribute('aria-checked')).toBe('mixed');
     });
 
-    it('setState should support checked state', function() {
+    it('setState should support checked state', function () {
       checkbox.setState('true');
       expect(elem.indeterminate, 'indeterminate on element').toBe(false);
       expect(elem.checked, 'checked prop on element').toBe(true);
       expect(elem.getAttribute('aria-checked')).toBe('true');
     });
 
-    it('setState should support unchecked state', function() {
+    it('setState should support unchecked state', function () {
       checkbox.setState('false');
       expect(elem.indeterminate, 'indeterminate on element').toBe(false);
       expect(elem.checked, 'checked prop on element').toBe(false);
       expect(elem.getAttribute('aria-checked')).toBe('false');
     });
 
-    it('Should check checkbox on click', function() {
+    it('Should check checkbox on click', function () {
       elem.checked = true;
       elem.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(elem.checked, 'checked prop on element').toBe(true);
     });
 
-    it('Should uncheck checkbox on click', function() {
+    it('Should uncheck checkbox on click', function () {
       elem.checked = false;
       elem.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(elem.checked, 'checked prop on element').toBe(false);
     });
 
-    it('Should show the checkbox upon focusing in nested checkbox', function() {
+    it('Should show the checkbox upon focusing in nested checkbox', function () {
       container.classList.add('bx--checkbox-label');
       elem.dispatchEvent(new CustomEvent('focus', { bubbles: true }));
       expect(container.classList.contains('bx--checkbox-label__focus')).toBe(
@@ -115,7 +115,7 @@ describe('Test Checkbox', function() {
       );
     });
 
-    it('Should hide the checkbox upon blur in nested checkbox', function() {
+    it('Should hide the checkbox upon blur in nested checkbox', function () {
       container.classList.add('bx--checkbox-label');
       container.classList.add('bx--checkbox-label__focus');
       elem.dispatchEvent(new CustomEvent('blur', { bubbles: true }));
@@ -124,7 +124,7 @@ describe('Test Checkbox', function() {
       );
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (checkbox) {
         checkbox = checkbox.release();
       }
diff --git a/packages/components/tests/spec/content-switcher_spec.js b/packages/components/tests/spec/content-switcher_spec.js
index 97dc8b21e6ea..e045bb17c7cd 100644
--- a/packages/components/tests/spec/content-switcher_spec.js
+++ b/packages/components/tests/spec/content-switcher_spec.js
@@ -4,9 +4,9 @@ import ContentSwitcher from '../../src/components/content-switcher/content-switc
 import HTML from '../../html/content-switcher/content-switcher.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test content switcher', function() {
-  describe('Constructor', function() {
-    it('Should set default options', function() {
+describe('Test content switcher', function () {
+  describe('Constructor', function () {
+    it('Should set default options', function () {
       const contentSwitcher = new ContentSwitcher(
         document.createElement('div')
       );
@@ -20,14 +20,14 @@ describe('Test content switcher', function() {
     });
   });
 
-  describe('_handleClick', function() {
+  describe('_handleClick', function () {
     let instance;
     let element;
     let wrapper;
     let buttons;
     const events = new EventManager();
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -36,14 +36,14 @@ describe('Test content switcher', function() {
       buttons = element.querySelectorAll('button');
     });
 
-    it('Should be called on click', function() {
+    it('Should be called on click', function () {
       spyOn(instance, '_handleClick');
       const event = new CustomEvent('click', { bubbles: true });
       buttons[1].dispatchEvent(event);
       expect(instance._handleClick).toHaveBeenCalled();
     });
 
-    it('Should update active item upon clicking', function() {
+    it('Should update active item upon clicking', function () {
       const event = new CustomEvent('click', { bubbles: true });
       buttons[1].dispatchEvent(event);
       expect(buttons[1].classList.contains(instance.options.classActive)).toBe(
@@ -54,16 +54,16 @@ describe('Test content switcher', function() {
       );
     });
 
-    it('Should update aria-selected upon clicking', function() {
+    it('Should update aria-selected upon clicking', function () {
       const event = new CustomEvent('click', { bubbles: true });
       buttons[1].dispatchEvent(event);
       expect(buttons[1].getAttribute('aria-selected')).toBe('true');
       expect(buttons[0].getAttribute('aria-selected')).toBe('false');
     });
 
-    it('Should provide a way to cancel switching item upon clicking', async function() {
-      const eventBeforeSelected = await new Promise(resolve => {
-        events.on(element, 'content-switcher-beingselected', event => {
+    it('Should provide a way to cancel switching item upon clicking', async function () {
+      const eventBeforeSelected = await new Promise((resolve) => {
+        events.on(element, 'content-switcher-beingselected', (event) => {
           event.preventDefault();
           resolve(event);
         });
@@ -78,21 +78,21 @@ describe('Test content switcher', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('setActive', function() {
+  describe('setActive', function () {
     let instance;
     let element;
     let wrapper;
     let buttons;
     const events = new EventManager();
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -101,7 +101,7 @@ describe('Test content switcher', function() {
       buttons = element.querySelectorAll('button');
     });
 
-    it('Should update selected item when using setActive method', function() {
+    it('Should update selected item when using setActive method', function () {
       instance.setActive(buttons[1]);
       expect(
         buttons[0].classList.contains('bx--content-switcher--selected')
@@ -111,13 +111,13 @@ describe('Test content switcher', function() {
       ).toBe(true);
     });
 
-    it('Should update aria-selected when using setActive method', function() {
+    it('Should update aria-selected when using setActive method', function () {
       instance.setActive(buttons[1]);
       expect(buttons[0].getAttribute('aria-selected')).toBe('false');
       expect(buttons[1].getAttribute('aria-selected')).toBe('true');
     });
 
-    it('Should update active item upon an API call', async function() {
+    it('Should update active item upon an API call', async function () {
       const item = await promisify(instance.setActive, { context: instance })(
         buttons[1]
       );
@@ -130,7 +130,7 @@ describe('Test content switcher', function() {
       ).toBe(true);
     });
 
-    it('Should update aria-selected upon an API call', async function() {
+    it('Should update aria-selected upon an API call', async function () {
       const item = await promisify(instance.setActive, { context: instance })(
         buttons[1]
       );
@@ -139,10 +139,10 @@ describe('Test content switcher', function() {
       expect(buttons[1].getAttribute('aria-selected')).toBe('true');
     });
 
-    it('Should provide a way to cancel switching item upon an API call', async function() {
+    it('Should provide a way to cancel switching item upon an API call', async function () {
       let errorBeforeSelected;
       let eventBeforeSelected;
-      events.on(element, 'content-switcher-beingselected', event => {
+      events.on(element, 'content-switcher-beingselected', (event) => {
         eventBeforeSelected = event;
         event.preventDefault();
       });
@@ -162,25 +162,23 @@ describe('Test content switcher', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('Panes', function() {
+  describe('Panes', function () {
     let element;
     let buttonNodes;
     let paneNodes;
     let contentSwitcher;
 
-    const id = `__element_${Math.random()
-      .toString(36)
-      .substr(2)}`;
+    const id = `__element_${Math.random().toString(36).substr(2)}`;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('div');
 
       buttonNodes = [...new Array(2)].map((item, i) => {
@@ -200,8 +198,8 @@ describe('Test content switcher', function() {
           paneNode.className = `${id}_${i}`;
           return paneNode;
         });
-      })).forEach(nodes => {
-        nodes.forEach(node => {
+      })).forEach((nodes) => {
+        nodes.forEach((node) => {
           document.body.appendChild(node);
         });
       });
@@ -210,7 +208,7 @@ describe('Test content switcher', function() {
       contentSwitcher = new ContentSwitcher(element);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       buttonNodes.forEach((buttonNode, i) => {
         buttonNode.classList[i === 0 ? 'add' : 'remove'](
           'bx--content-switcher--selected'
@@ -218,39 +216,39 @@ describe('Test content switcher', function() {
       });
     });
 
-    it('Should select target pane', function() {
+    it('Should select target pane', function () {
       try {
         buttonNodes[0].dataset.target = `.${id}_0`;
         buttonNodes[1].dataset.target = `.${id}_1`;
         buttonNodes[1].dispatchEvent(
           new CustomEvent('click', { bubbles: true })
         );
-        paneNodes[0].forEach(node => {
+        paneNodes[0].forEach((node) => {
           expect(node.hasAttribute('hidden'), 'hidden of unselected item').toBe(
             true
           );
         });
-        paneNodes[1].forEach(node => {
+        paneNodes[1].forEach((node) => {
           expect(node.hasAttribute('hidden'), 'hidden of selected item').toBe(
             false
           );
         });
       } finally {
         // eslint-disable-next-line no-param-reassign
-        buttonNodes.forEach(buttonNode => {
+        buttonNodes.forEach((buttonNode) => {
           buttonNode.dataset.target = undefined;
         });
       }
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       contentSwitcher.release();
-      paneNodes.forEach(nodes => {
-        nodes.forEach(node => {
+      paneNodes.forEach((nodes) => {
+        nodes.forEach((node) => {
           document.body.removeChild(node);
         });
       });
@@ -258,11 +256,11 @@ describe('Test content switcher', function() {
     });
   });
 
-  describe('Setting active item with link', function() {
+  describe('Setting active item with link', function () {
     let element;
     let linkNodes;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('div');
 
       document.body.appendChild(element);
@@ -281,13 +279,13 @@ describe('Test content switcher', function() {
       });
     });
 
-    it('Should update active item upon clicking', function() {
+    it('Should update active item upon clicking', function () {
       linkNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(linkNodes[0].getAttribute('aria-selected')).toBe('false');
       expect(linkNodes[1].getAttribute('aria-selected')).toBe('true');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(element);
     });
   });
diff --git a/packages/components/tests/spec/copy-button_spec.js b/packages/components/tests/spec/copy-button_spec.js
index e3bb64d07581..25f35ab4d514 100644
--- a/packages/components/tests/spec/copy-button_spec.js
+++ b/packages/components/tests/spec/copy-button_spec.js
@@ -10,9 +10,9 @@ const HTML = `
 </button>
 `;
 
-describe('Test Copy Button', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test Copy Button', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new CopyButton();
       }).toThrowError(
@@ -21,7 +21,7 @@ describe('Test Copy Button', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new CopyButton(document.createTextNode(''));
       }).toThrowError(
@@ -31,14 +31,14 @@ describe('Test Copy Button', function() {
     });
   });
 
-  describe('Showing and hiding feedback tooltip', function() {
+  describe('Showing and hiding feedback tooltip', function () {
     let container;
     let element;
     let feedbackTooltip;
     let copyBtn;
     let feedbackTooltipInitialState;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -50,22 +50,22 @@ describe('Test Copy Button', function() {
       copyBtn = new CopyButton(element);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       jasmine.clock().install();
     });
 
-    it('Should not show the feedback tooltip before click', function() {
+    it('Should not show the feedback tooltip before click', function () {
       expect(feedbackTooltipInitialState).toBe(false);
     });
 
-    it('Should show the feedback tooltip on click', function() {
+    it('Should show the feedback tooltip on click', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         feedbackTooltip.classList.contains('bx--btn--copy__feedback--displayed')
       ).toBe(true);
     });
 
-    it('Should hide the feedback tooltip after specified timeout value', function() {
+    it('Should hide the feedback tooltip after specified timeout value', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         feedbackTooltip.classList.contains('bx--btn--copy__feedback--displayed')
@@ -76,12 +76,12 @@ describe('Test Copy Button', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       feedbackTooltip.classList.remove('bx--btn--copy__feedback--displayed');
       jasmine.clock().uninstall();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       copyBtn.release();
     });
diff --git a/packages/components/tests/spec/data-table_spec.js b/packages/components/tests/spec/data-table_spec.js
index 81cc05c21226..fc29a7db31f5 100644
--- a/packages/components/tests/spec/data-table_spec.js
+++ b/packages/components/tests/spec/data-table_spec.js
@@ -5,9 +5,9 @@ import HTML from '../../html/data-table/data-table.html';
 import ExpandableHTML from '../../html/data-table/data-table--expandable.html';
 import ExpandableAllHTML from '../../html/data-table/data-table--expandable-with-expand-all.html';
 
-describe('DataTable', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('DataTable', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new DataTable();
       }).toThrowError(
@@ -16,7 +16,7 @@ describe('DataTable', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new DataTable(document.createTextNode(''));
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('DataTable', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       const table = new DataTable(document.createElement('div'));
       expect(flattenOptions(table.options)).toEqual({
         selectorInit: `[data-table]`,
@@ -65,12 +65,12 @@ describe('DataTable', function() {
     });
   });
 
-  describe('Initial tasks', function() {
+  describe('Initial tasks', function () {
     let container;
     let element;
     let table;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -78,27 +78,27 @@ describe('DataTable', function() {
       table = new DataTable(element);
     });
 
-    it('Expandable rows should be removed from the DOM', function() {
+    it('Expandable rows should be removed from the DOM', function () {
       const rows = [...element.querySelectorAll('tbody > tr')];
 
-      rows.forEach(row => {
+      rows.forEach((row) => {
         expect(row.classList.contains('[data-child-row]')).toBe(false);
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       table.release();
     });
   });
 
-  describe('Row Expansion', function() {
+  describe('Row Expansion', function () {
     const events = new EventManager();
     let element;
     let table;
     let container;
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = ExpandableHTML;
       document.body.appendChild(container);
@@ -106,7 +106,7 @@ describe('DataTable', function() {
       table = new DataTable(element);
     });
 
-    it('Should toggle the row on click', function() {
+    it('Should toggle the row on click', function () {
       const firstRowExpand = document.querySelector('[data-event="expand"]');
       firstRowExpand.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
@@ -122,7 +122,7 @@ describe('DataTable', function() {
       ).toBe(false);
     });
 
-    it('Should emit an event on row expansion click', function() {
+    it('Should emit an event on row expansion click', function () {
       const firstRowExpand = document.querySelector('[data-event="expand"]');
       const spyToggleRowExpandEvent = jasmine.createSpy();
       events.on(
@@ -134,27 +134,27 @@ describe('DataTable', function() {
       expect(spyToggleRowExpandEvent).toHaveBeenCalled();
     });
 
-    it('The event should trigger the function', function() {
+    it('The event should trigger the function', function () {
       const firstRowExpand = document.querySelector('[data-event="expand"]');
       spyOn(table, '_rowExpandToggle');
       firstRowExpand.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(table._rowExpandToggle).toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
       table.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Batch row Expansion', function() {
+  describe('Batch row Expansion', function () {
     const events = new EventManager();
     let element;
     let table;
     let container;
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = ExpandableAllHTML;
       document.body.appendChild(container);
@@ -162,25 +162,25 @@ describe('DataTable', function() {
       table = new DataTable(element);
     });
 
-    it('Should toggle the rows on click', function() {
+    it('Should toggle the rows on click', function () {
       const headerExpand = element.querySelector('[data-event="expandAll"]');
       headerExpand.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       const expandedStateAfterExpand = Array.prototype.map.call(
         element.querySelectorAll('[data-child-row]'),
-        elem =>
+        (elem) =>
           elem.previousElementSibling.classList.contains(`bx--expandable-row`)
       );
       expect(expandedStateAfterExpand).toEqual([true, true]);
       headerExpand.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       const expandedStateAfterCollapse = Array.prototype.map.call(
         element.querySelectorAll('[data-child-row]'),
-        elem =>
+        (elem) =>
           elem.previousElementSibling.classList.contains(`bx--expandable-row`)
       );
       expect(expandedStateAfterCollapse).toEqual([false, false]);
     });
 
-    it('Should emit an event on row expansion click', function() {
+    it('Should emit an event on row expansion click', function () {
       const headerExpand = element.querySelector('[data-event="expandAll"]');
       const spyToggleRowExpandEvent = jasmine.createSpy();
       events.on(
@@ -192,28 +192,28 @@ describe('DataTable', function() {
       expect(spyToggleRowExpandEvent).toHaveBeenCalled();
     });
 
-    it('The event should trigger the function', function() {
+    it('The event should trigger the function', function () {
       const headerExpand = element.querySelector('[data-event="expandAll"]');
       spyOn(table, '_rowExpandToggleAll');
       headerExpand.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(table._rowExpandToggleAll).toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
       table.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Sort', function() {
+  describe('Sort', function () {
     const events = new EventManager();
     let element;
     let table;
     let container;
     let firstSort;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -222,7 +222,7 @@ describe('DataTable', function() {
       table = new DataTable(element);
     });
 
-    it('Should switch through tri-state sort', function() {
+    it('Should switch through tri-state sort', function () {
       firstSort.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(firstSort.classList.contains(`bx--table-sort--ascending`)).toBe(
         true
@@ -246,7 +246,7 @@ describe('DataTable', function() {
       expect(firstSort.hasAttribute('data-previous-value')).toBe(false);
     });
 
-    it('Should emit an event on sort click', function() {
+    it('Should emit an event on sort click', function () {
       const spyToggleSortEvent = jasmine.createSpy();
       events.on(
         element.ownerDocument.body,
@@ -257,25 +257,25 @@ describe('DataTable', function() {
       expect(spyToggleSortEvent).toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       firstSort.classList.remove(`bx--table-sort--ascending`);
       firstSort.dataset.previousValue = '';
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       table.release();
     });
   });
 
-  describe('Action bar', function() {
+  describe('Action bar', function () {
     const events = new EventManager();
     let element;
     let table;
     let container;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -283,7 +283,7 @@ describe('DataTable', function() {
       table = new DataTable(element);
     });
 
-    it('Should toggle the action bar on checkbox select', function() {
+    it('Should toggle the action bar on checkbox select', function () {
       const firstSelect = document.querySelector('[data-event="select"]');
       firstSelect.click();
 
@@ -303,7 +303,7 @@ describe('DataTable', function() {
 
     // it('Should close the action bar on ESC key', function() {});
 
-    it('Should select all checkboxes on select all event', function() {
+    it('Should select all checkboxes on select all event', function () {
       const firstSelect = document.querySelector('[data-event="select-all"]');
       firstSelect.click();
 
@@ -313,23 +313,23 @@ describe('DataTable', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       table._actionBarCancel();
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       table.release();
     });
   });
 
-  describe('Toggle active search bar', function() {
+  describe('Toggle active search bar', function () {
     let table;
     let container;
     let dt;
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -337,7 +337,7 @@ describe('DataTable', function() {
       table = new DataTable(container);
     });
 
-    it('Should open search bar on click', function() {
+    it('Should open search bar on click', function () {
       const search = document.querySelector(
         '.bx--toolbar-search-container-expandable'
       );
@@ -348,7 +348,7 @@ describe('DataTable', function() {
       ).toBe(true);
     });
 
-    it('Should close search bar on click', function() {
+    it('Should close search bar on click', function () {
       const search = document.querySelector(
         '.bx--toolbar-search-container-expandable'
       );
@@ -359,7 +359,7 @@ describe('DataTable', function() {
       ).toBe(false);
     });
 
-    it('Should open search bar on keydown', function() {
+    it('Should open search bar on keydown', function () {
       const search = document.querySelector(
         '.bx--toolbar-search-container-expandable'
       );
@@ -372,7 +372,7 @@ describe('DataTable', function() {
       ).toBe(true);
     });
 
-    it('Should close search bar on keydown', function() {
+    it('Should close search bar on keydown', function () {
       const search = document.querySelector(
         '.bx--toolbar-search-container-expandable'
       );
@@ -386,7 +386,7 @@ describe('DataTable', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       document.body.removeChild(container);
       table.release();
     });
diff --git a/packages/components/tests/spec/date-picker_spec.js b/packages/components/tests/spec/date-picker_spec.js
index c7030b45055a..ac4d64672118 100644
--- a/packages/components/tests/spec/date-picker_spec.js
+++ b/packages/components/tests/spec/date-picker_spec.js
@@ -2,9 +2,9 @@ import DatePicker from '../../src/components/date-picker/date-picker';
 import singleCalHTML from '../../html/date-picker/date-picker--single.html';
 import rangeCalHTML from '../../html/date-picker/date-picker--range.html';
 
-describe('Test date picker', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test date picker', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new DatePicker();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Test date picker', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new DatePicker(document.createTextNode(''));
       }).toThrowError(
@@ -23,7 +23,7 @@ describe('Test date picker', function() {
     });
   });
 
-  describe('Creating a date picker with a single mode calendar', function() {
+  describe('Creating a date picker with a single mode calendar', function () {
     let element;
     let datePicker;
     let datePickerInput;
@@ -31,7 +31,7 @@ describe('Test date picker', function() {
     const container = document.createElement('div');
     container.innerHTML = singleCalHTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       element = document.querySelector('[data-date-picker]');
       datePicker = new DatePicker(element);
@@ -39,15 +39,15 @@ describe('Test date picker', function() {
       datePickerIcon = document.querySelector('[data-date-picker-icon]');
     });
 
-    it('Should add a calendar', function() {
+    it('Should add a calendar', function () {
       expect(datePicker.calendar).not.toBe(undefined);
     });
 
-    it('Should be a single calendar and not range mode', function() {
+    it('Should be a single calendar and not range mode', function () {
       expect(datePicker.calendar.config.mode === 'single').toBe(true);
     });
 
-    it('Should show the calendar when the input field is clicked', function() {
+    it('Should show the calendar when the input field is clicked', function () {
       datePickerInput.dispatchEvent(
         new CustomEvent('focus', { bubbles: true })
       );
@@ -56,14 +56,14 @@ describe('Test date picker', function() {
       ).toBe(true);
     });
 
-    it('Should show the calendar when the calendar icon is clicked', function() {
+    it('Should show the calendar when the calendar icon is clicked', function () {
       datePickerIcon.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         datePicker.calendar.calendarContainer.classList.contains('open')
       ).toBe(true);
     });
 
-    it('Should hide the calendar on click outside the date picker', function() {
+    it('Should hide the calendar on click outside the date picker', function () {
       // Avoid using open() API as we force it open during the event loop where open() is called
       datePicker.calendar.calendarContainer.classList.add('open');
       datePicker.calendar.isOpen = true;
@@ -77,7 +77,7 @@ describe('Test date picker', function() {
       ).toBe(false);
     });
 
-    it('Should update the selected date in the calendar when input changes', function() {
+    it('Should update the selected date in the calendar when input changes', function () {
       datePickerInput.value = '10/10/2017';
       datePickerInput.dispatchEvent(
         new CustomEvent('change', {
@@ -90,18 +90,18 @@ describe('Test date picker', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       // Quick way to get ready for next test before we set false to shouldForceOpen upon the timer
       datePicker.shouldForceOpen = false;
     });
 
-    afterAll(function() {
+    afterAll(function () {
       datePicker.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Creating a date picker with a range mode calendar', function() {
+  describe('Creating a date picker with a range mode calendar', function () {
     let element;
     let datePicker;
     let datePickerInputFrom;
@@ -110,7 +110,7 @@ describe('Test date picker', function() {
     const container = document.createElement('div');
     container.innerHTML = rangeCalHTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       element = document.querySelector('[data-date-picker]');
       datePicker = new DatePicker(element);
@@ -123,15 +123,15 @@ describe('Test date picker', function() {
       datePickerIcon = document.querySelector('[data-date-picker-icon]');
     });
 
-    it('Should add a calendar', function() {
+    it('Should add a calendar', function () {
       expect(datePicker.calendar).not.toBe(undefined);
     });
 
-    it('Should be a range calendar', function() {
+    it('Should be a range calendar', function () {
       expect(datePicker.calendar.config.mode === 'range').toBe(true);
     });
 
-    it('Should show the calendar when the first input field is clicked', function() {
+    it('Should show the calendar when the first input field is clicked', function () {
       datePickerInputFrom.dispatchEvent(
         new CustomEvent('focus', { bubbles: true })
       );
@@ -140,7 +140,7 @@ describe('Test date picker', function() {
       ).toBe(true);
     });
 
-    it('Should show the calendar when the second input field is clicked', function() {
+    it('Should show the calendar when the second input field is clicked', function () {
       datePickerInputTo.dispatchEvent(
         new CustomEvent('focus', { bubbles: true })
       );
@@ -149,14 +149,14 @@ describe('Test date picker', function() {
       ).toBe(true);
     });
 
-    it('Should show the calendar when the calendar icon is clicked', function() {
+    it('Should show the calendar when the calendar icon is clicked', function () {
       datePickerIcon.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         datePicker.calendar.calendarContainer.classList.contains('open')
       ).toBe(true);
     });
 
-    it('Should hide the calendar on click outside the date picker', function() {
+    it('Should hide the calendar on click outside the date picker', function () {
       // Avoid using open() API as we force it open during the event loop where open() is called
       datePicker.calendar.calendarContainer.classList.add('open');
       datePicker.calendar.isOpen = true;
@@ -170,7 +170,7 @@ describe('Test date picker', function() {
       ).toBe(false);
     });
 
-    it('Should update the selected date in the calendar when input changes', function() {
+    it('Should update the selected date in the calendar when input changes', function () {
       datePickerInputFrom.value = '10/10/2017';
       datePickerInputFrom.dispatchEvent(
         new CustomEvent('change', {
@@ -183,12 +183,12 @@ describe('Test date picker', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       // Quick way to get ready for next test before we set false to shouldForceOpen upon the timer
       datePicker.shouldForceOpen = false;
     });
 
-    afterAll(function() {
+    afterAll(function () {
       datePicker.release();
       document.body.removeChild(container);
     });
diff --git a/packages/components/tests/spec/dropdown_spec.js b/packages/components/tests/spec/dropdown_spec.js
index 1527359096d6..8f9d0d61610f 100644
--- a/packages/components/tests/spec/dropdown_spec.js
+++ b/packages/components/tests/spec/dropdown_spec.js
@@ -2,9 +2,9 @@ import { delay } from 'bluebird'; // For testing on browsers not supporting Prom
 import EventManager from '../utils/event-manager';
 import Dropdown from '../../src/components/dropdown/dropdown';
 
-describe('Dropdown', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Dropdown', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Dropdown();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Dropdown', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Dropdown(document.createTextNode(''));
       }).toThrowError(
@@ -22,7 +22,7 @@ describe('Dropdown', function() {
       );
     });
 
-    it('Should not instantiate with "open" stateful modifier class', function() {
+    it('Should not instantiate with "open" stateful modifier class', function () {
       const element = document.createElement('ul');
       new Dropdown(element);
       document.body.appendChild(element);
@@ -31,12 +31,12 @@ describe('Dropdown', function() {
   });
 
   // test backwards compatibility with legacy markup
-  describe('Toggle', function() {
+  describe('Toggle', function () {
     let dropdown;
     let element;
     let itemNode;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('ul');
       element.classList.add('bx--dropdown');
 
@@ -58,7 +58,7 @@ describe('Dropdown', function() {
       document.body.appendChild(element);
     });
 
-    it('Should add "open" stateful modifier class', function() {
+    it('Should add "open" stateful modifier class', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('bx--dropdown--open')).toBe(true);
       expect(element.getAttribute('class')).toBe(
@@ -66,26 +66,26 @@ describe('Dropdown', function() {
       );
     });
 
-    it('Should remove "open" stateful modifier class (closed default state)', function() {
+    it('Should remove "open" stateful modifier class (closed default state)', function () {
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('bx--dropdown--open')).toBe(false);
       expect(element.getAttribute('class')).toBe('bx--dropdown');
     });
 
-    it('Should always close dropdown when clicking document', function() {
+    it('Should always close dropdown when clicking document', function () {
       element.classList.add('bx--dropdown--open');
       document.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.getAttribute('class')).toBe('bx--dropdown');
     });
 
-    it('Should close dropdown when clicking on an item', function() {
+    it('Should close dropdown when clicking on an item', function () {
       element.classList.add('bx--dropdown--open');
       itemNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.getAttribute('class')).toBe('bx--dropdown');
     });
 
-    it('Should open dropdown with enter key', function() {
+    it('Should open dropdown with enter key', function () {
       spyOn(element, 'focus');
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 13 })
@@ -97,7 +97,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should close dropdown with enter key', async function() {
+    it('Should close dropdown with enter key', async function () {
       spyOn(element, 'focus');
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(
@@ -111,7 +111,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should open dropdown with space key', function() {
+    it('Should open dropdown with space key', function () {
       spyOn(element, 'focus');
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 32 })
@@ -123,7 +123,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should close dropdown with space key', async function() {
+    it('Should close dropdown with space key', async function () {
       spyOn(element, 'focus');
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(
@@ -137,7 +137,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should not close dropdown with space key on an item', function() {
+    it('Should not close dropdown with space key on an item', function () {
       spyOn(element, 'focus');
       element.classList.add('bx--dropdown--open');
       itemNode.dispatchEvent(
@@ -152,7 +152,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').not.toHaveBeenCalled();
     });
 
-    it('Should close dropdown with ESC key', async function() {
+    it('Should close dropdown with ESC key', async function () {
       spyOn(element, 'focus');
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(
@@ -166,7 +166,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should close dropdown with ESC key on an item', async function() {
+    it('Should close dropdown with ESC key on an item', async function () {
       spyOn(element, 'focus');
       element.classList.add('bx--dropdown--open');
       itemNode.dispatchEvent(
@@ -182,7 +182,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should not open dropdown with ESC key', function() {
+    it('Should not open dropdown with ESC key', function () {
       spyOn(element, 'focus');
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 27 })
@@ -194,7 +194,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').not.toHaveBeenCalled();
     });
 
-    it('Should not open when the disabled class is applied', function() {
+    it('Should not open when the disabled class is applied', function () {
       element.classList.add('bx--dropdown--disabled');
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
@@ -203,25 +203,25 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('bx--dropdown--disabled');
       element.classList.remove('bx--dropdown--open');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       dropdown.release();
       document.body.removeChild(element);
     });
   });
 
-  describe('Toggle with semantic markup', function() {
+  describe('Toggle with semantic markup', function () {
     let dropdown;
     let element;
     let itemNode;
     let trigger;
     let list;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('div');
       element.classList.add('bx--dropdown');
 
@@ -246,7 +246,7 @@ describe('Dropdown', function() {
       document.body.appendChild(element);
     });
 
-    it('Should add "open" stateful modifier class', function() {
+    it('Should add "open" stateful modifier class', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('bx--dropdown--open')).toBe(true);
       expect(element.getAttribute('class')).toBe(
@@ -254,20 +254,20 @@ describe('Dropdown', function() {
       );
     });
 
-    it('Should setup active descendent when open', function() {
+    it('Should setup active descendent when open', function () {
       trigger.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(list.getAttribute('aria-activedescendant')).toBe(itemNode.id);
       expect(itemNode.classList.contains('bx--dropdown--focused')).toBe(true);
     });
 
-    it('Should remove "open" stateful modifier class (closed default state)', function() {
+    it('Should remove "open" stateful modifier class (closed default state)', function () {
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('bx--dropdown--open')).toBe(false);
       expect(element.getAttribute('class')).toBe('bx--dropdown');
     });
 
-    it('Should remove active descendent setup when closed', function() {
+    it('Should remove active descendent setup when closed', function () {
       // Open the dropdown
       trigger.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       // Close the dropdown
@@ -276,7 +276,7 @@ describe('Dropdown', function() {
       expect(itemNode.classList.contains('bx--dropdown--focused')).toBe(false);
     });
 
-    it('Should open dropdown with enter key', function() {
+    it('Should open dropdown with enter key', function () {
       spyOn(list, 'focus');
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 13 })
@@ -285,7 +285,7 @@ describe('Dropdown', function() {
       expect(list.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should close dropdown with enter key', async function() {
+    it('Should close dropdown with enter key', async function () {
       spyOn(trigger, 'focus');
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(
@@ -296,7 +296,7 @@ describe('Dropdown', function() {
       expect(trigger.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should open dropdown with space key', function() {
+    it('Should open dropdown with space key', function () {
       spyOn(list, 'focus');
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 32 })
@@ -305,7 +305,7 @@ describe('Dropdown', function() {
       expect(list.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should close dropdown with space key', async function() {
+    it('Should close dropdown with space key', async function () {
       spyOn(trigger, 'focus');
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(
@@ -316,7 +316,7 @@ describe('Dropdown', function() {
       expect(trigger.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should not close dropdown with space key on an item', function() {
+    it('Should not close dropdown with space key on an item', function () {
       spyOn(element, 'focus');
       element.classList.add('bx--dropdown--open');
       itemNode.dispatchEvent(
@@ -328,7 +328,7 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').not.toHaveBeenCalled();
     });
 
-    it('Should close dropdown with ESC key', async function() {
+    it('Should close dropdown with ESC key', async function () {
       spyOn(trigger, 'focus');
       element.classList.add('bx--dropdown--open');
       element.dispatchEvent(
@@ -339,7 +339,7 @@ describe('Dropdown', function() {
       expect(trigger.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should close dropdown with ESC key on an item', async function() {
+    it('Should close dropdown with ESC key on an item', async function () {
       spyOn(trigger, 'focus');
       element.classList.add('bx--dropdown--open');
       itemNode.dispatchEvent(
@@ -352,7 +352,7 @@ describe('Dropdown', function() {
       expect(trigger.focus, 'Focus requested').toHaveBeenCalledTimes(1);
     });
 
-    it('Should not open dropdown with ESC key', function() {
+    it('Should not open dropdown with ESC key', function () {
       spyOn(element, 'focus');
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 27 })
@@ -361,25 +361,25 @@ describe('Dropdown', function() {
       expect(element.focus, 'Focus requested').not.toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('bx--dropdown--disabled');
       element.classList.remove('bx--dropdown--open');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       dropdown.release();
       document.body.removeChild(element);
     });
   });
 
-  describe('Selecting an item', function() {
+  describe('Selecting an item', function () {
     let dropdown;
     let element;
     let textNode;
     let itemNodes;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('ul');
       textNode = element.appendChild(document.createElement('li'));
       textNode.classList.add('bx--dropdown-text');
@@ -408,7 +408,7 @@ describe('Dropdown', function() {
       document.body.appendChild(element);
     });
 
-    it('Should add/remove "selected" modifier class', function() {
+    it('Should add/remove "selected" modifier class', function () {
       itemNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         itemNodes[0].parentElement.classList.contains('bx--dropdown--selected'),
@@ -420,18 +420,18 @@ describe('Dropdown', function() {
       ).toBe(true);
     });
 
-    it('Should update text', function() {
+    it('Should update text', function () {
       itemNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(textNode.textContent).toBe('1');
     });
 
-    it('Should not update text if navigation', function() {
+    it('Should not update text if navigation', function () {
       element.setAttribute('data-dropdown-type', 'navigation');
       itemNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(textNode.textContent).toBe('0');
     });
 
-    it('Should not add "selected" modifier class if dropdown type is navigation', function() {
+    it('Should not add "selected" modifier class if dropdown type is navigation', function () {
       element.setAttribute('data-dropdown-type', 'navigation');
       itemNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
@@ -444,7 +444,7 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    it('Should not cause an error if text does not exist', function() {
+    it('Should not cause an error if text does not exist', function () {
       textNode.parentNode.removeChild(textNode);
       expect(() => {
         itemNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
@@ -452,8 +452,8 @@ describe('Dropdown', function() {
       expect(textNode.textContent, 'Text').toBe('0');
     });
 
-    it('Should provide a way to cancel switching item', function() {
-      events.on(element, 'dropdown-beingselected', e => {
+    it('Should provide a way to cancel switching item', function () {
+      events.on(element, 'dropdown-beingselected', (e) => {
         expect(e.detail.item).toBe(itemNodes[1]);
         e.preventDefault();
       });
@@ -469,7 +469,7 @@ describe('Dropdown', function() {
       expect(textNode.textContent).toBe('0');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       itemNodes[0].parentElement.classList.add('bx--dropdown--selected');
       itemNodes[1].parentElement.classList.remove('bx--dropdown--selected');
       textNode.textContent = '0';
@@ -480,20 +480,20 @@ describe('Dropdown', function() {
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       dropdown.release();
       document.body.removeChild(element);
     });
   });
 
   // test backwards compatibility with legacy markup
-  describe('Navigating focus', function() {
+  describe('Navigating focus', function () {
     let dropdown;
     let element;
     let itemNodes;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('ul');
 
       const listContainer = element.appendChild(document.createElement('li'));
@@ -517,8 +517,8 @@ describe('Dropdown', function() {
       document.body.appendChild(element);
     });
 
-    beforeEach(function() {
-      itemNodes.forEach(item => {
+    beforeEach(function () {
+      itemNodes.forEach((item) => {
         item.parentElement.classList.remove('bx--dropdown--selected');
         item.removeAttribute('hidden');
         item.parentNode.removeAttribute('hidden');
@@ -529,8 +529,8 @@ describe('Dropdown', function() {
       element.focus();
     });
 
-    it('Should select the first one for forward navigation if there is no selection', function() {
-      itemNodes.forEach(item => {
+    it('Should select the first one for forward navigation if there is no selection', function () {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -544,8 +544,8 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    it('Should select the last one for backward navigation if there is no selection', function() {
-      itemNodes.forEach(item => {
+    it('Should select the last one for backward navigation if there is no selection', function () {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       element.dispatchEvent(
@@ -556,9 +556,9 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should start with selection for forward navigation', function() {
+    it('Should start with selection for forward navigation', function () {
       itemNodes[0].parentElement.classList.add('bx--dropdown--selected');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -572,9 +572,9 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    it('Should start with selection for backward navigation', function() {
+    it('Should start with selection for backward navigation', function () {
       itemNodes[2].parentElement.classList.add('bx--dropdown--selected');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -588,9 +588,9 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    it('Should handle overflow for forward navigation', function() {
+    it('Should handle overflow for forward navigation', function () {
       itemNodes[2].classList.add('bx--dropdown--selected');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -604,9 +604,9 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    it('Should handle underflow for backward navigation', function() {
+    it('Should handle underflow for backward navigation', function () {
       itemNodes[0].classList.add('bx--dropdown--selected');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       element.dispatchEvent(
@@ -617,12 +617,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should start with focused element over selection for forward navigation', function() {
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+    it('Should start with focused element over selection for forward navigation', function () {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[0];
       });
       itemNodes[2].classList.add('bx--dropdown--selected');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -636,12 +636,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    it('Should start with focused element over selection for backward navigation', function() {
+    it('Should start with focused element over selection for backward navigation', function () {
       itemNodes[0].classList.add('bx--dropdown--selected');
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[2];
       });
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       element.dispatchEvent(
@@ -652,12 +652,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    it('Should skip selected items', function() {
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+    it('Should skip selected items', function () {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[0];
       });
       itemNodes[1].parentElement.classList.add('bx--dropdown--selected');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -671,12 +671,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should skip items with hidden link', function() {
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+    it('Should skip items with hidden link', function () {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[0];
       });
       itemNodes[1].setAttribute('hidden', '');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -690,12 +690,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should skip items with hidden container', function() {
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+    it('Should skip items with hidden container', function () {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[0];
       });
       itemNodes[1].parentNode.setAttribute('hidden', '');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -709,12 +709,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should skip items with link with aria-hidden', function() {
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+    it('Should skip items with link with aria-hidden', function () {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[0];
       });
       itemNodes[1].setAttribute('aria-hidden', 'true');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -728,12 +728,12 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should skip items with container with aria-hidden', function() {
-      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function() {
+    it('Should skip items with container with aria-hidden', function () {
+      spyOn(dropdown, 'getCurrentNavigation').and.callFake(function () {
         return itemNodes[0];
       });
       itemNodes[1].parentNode.setAttribute('aria-hidden', 'true');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -747,9 +747,9 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').toHaveBeenCalledTimes(1);
     });
 
-    it('Should not navigate unless dropdown is open', function() {
+    it('Should not navigate unless dropdown is open', function () {
       element.classList.remove('bx--dropdown--open');
-      itemNodes.forEach(item => {
+      itemNodes.forEach((item) => {
         spyOn(item, 'focus');
       });
       const defaultPrevented = !element.dispatchEvent(
@@ -763,17 +763,17 @@ describe('Dropdown', function() {
       expect(itemNodes[2].focus, 'Focus on 3rd item').not.toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       dropdown.release();
       document.body.removeChild(element);
     });
   });
 
-  describe('Navigating focus with semantic markup', function() {
+  describe('Navigating focus with semantic markup', function () {
     let dropdown;
     let element;
     let itemNodes;
@@ -782,7 +782,7 @@ describe('Dropdown', function() {
 
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('div');
       element.classList.add('bx--dropdown');
 
@@ -810,8 +810,8 @@ describe('Dropdown', function() {
       document.body.appendChild(element);
     });
 
-    beforeEach(function() {
-      itemNodes.forEach(item => {
+    beforeEach(function () {
+      itemNodes.forEach((item) => {
         item.parentElement.classList.remove('bx--dropdown--selected');
         item.classList.remove('bx--dropdown--focused');
         item.removeAttribute('hidden');
@@ -821,7 +821,7 @@ describe('Dropdown', function() {
       });
     });
 
-    it('Should focus the first item with no selection', function() {
+    it('Should focus the first item with no selection', function () {
       trigger.click();
       expect(list.getAttribute('aria-activedescendant')).toBe(itemNodes[0].id);
       expect(
@@ -838,7 +838,7 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    it('Should start with selection for forward navigation', function() {
+    it('Should start with selection for forward navigation', function () {
       itemNodes[0].classList.add('bx--dropdown--selected');
       trigger.click();
       const defaultPrevented = !element.dispatchEvent(
@@ -862,7 +862,7 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    it('Should start with selection for backward navigation', function() {
+    it('Should start with selection for backward navigation', function () {
       itemNodes[2].parentElement.classList.add('bx--dropdown--selected');
       trigger.click();
       const defaultPrevented = !element.dispatchEvent(
@@ -886,7 +886,7 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    it('Should handle overflow for forward navigation', function() {
+    it('Should handle overflow for forward navigation', function () {
       itemNodes[2].parentElement.classList.add('bx--dropdown--selected');
       trigger.click();
       const defaultPrevented = !element.dispatchEvent(
@@ -910,7 +910,7 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    it('Should handle underflow for backward navigation', function() {
+    it('Should handle underflow for backward navigation', function () {
       itemNodes[0].classList.add('bx--dropdown--selected');
       trigger.click();
       element.dispatchEvent(
@@ -931,18 +931,18 @@ describe('Dropdown', function() {
       ).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
       trigger.click();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       dropdown.release();
       document.body.removeChild(element);
     });
   });
 
-  describe('Navigating focus with show selected modifier', function() {
+  describe('Navigating focus with show selected modifier', function () {
     let dropdown;
     let element;
     let itemNodes;
@@ -951,7 +951,7 @@ describe('Dropdown', function() {
 
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('div');
       element.classList.add('bx--dropdown', 'bx--dropdown--show-selected');
 
@@ -979,8 +979,8 @@ describe('Dropdown', function() {
       document.body.appendChild(element);
     });
 
-    beforeEach(function() {
-      itemNodes.forEach(item => {
+    beforeEach(function () {
+      itemNodes.forEach((item) => {
         item.parentElement.classList.remove('bx--dropdown--selected');
         item.classList.remove('bx--dropdown--focused');
         item.removeAttribute('hidden');
@@ -990,7 +990,7 @@ describe('Dropdown', function() {
       });
     });
 
-    it('Should focus selected item with forward navigation', function() {
+    it('Should focus selected item with forward navigation', function () {
       itemNodes[1].parentElement.classList.add('bx--dropdown--selected');
       trigger.click();
 
@@ -1035,7 +1035,7 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    it('Should focus selected item with backward navigation', function() {
+    it('Should focus selected item with backward navigation', function () {
       itemNodes[1].parentElement.classList.add('bx--dropdown--selected');
       trigger.click();
 
@@ -1080,23 +1080,23 @@ describe('Dropdown', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
       trigger.click();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       dropdown.release();
       document.body.removeChild(element);
     });
   });
 
-  describe('Close on blur', function() {
+  describe('Close on blur', function () {
     let dropdown;
     let element;
     let input;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('ul');
 
       const listContainer = element.appendChild(document.createElement('li'));
@@ -1119,17 +1119,17 @@ describe('Dropdown', function() {
       document.body.appendChild(input);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       dropdown.element.classList.add('bx--dropdown--open');
       element.querySelector('.bx--dropdown-link').focus();
     });
 
-    it('Should close when dropdown loses focus', function() {
+    it('Should close when dropdown loses focus', function () {
       input.focus();
       expect(dropdown.element.contains(document.activeElement)).toBe(false);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (document.body.contains(input)) {
         document.body.removeChild(input);
       }
@@ -1138,14 +1138,14 @@ describe('Dropdown', function() {
     });
   });
 
-  describe('Managing instances: create() and release()', function() {
+  describe('Managing instances: create() and release()', function () {
     let element;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('a');
     });
 
-    it('Should prevent creating duplicate instances', function() {
+    it('Should prevent creating duplicate instances', function () {
       let first;
       let second;
       try {
@@ -1160,7 +1160,7 @@ describe('Dropdown', function() {
       }
     });
 
-    it('Should create a new instance for an element if an earlier one has been released', function() {
+    it('Should create a new instance for an element if an earlier one has been released', function () {
       let first;
       let second;
       try {
@@ -1176,7 +1176,7 @@ describe('Dropdown', function() {
       }
     });
 
-    it('Should remove click event listener on document object once the instance is released', function() {
+    it('Should remove click event listener on document object once the instance is released', function () {
       element.classList.add('bx--dropdown--open');
       document.body.appendChild(element);
       Dropdown.create(element).release();
@@ -1184,7 +1184,7 @@ describe('Dropdown', function() {
       expect(element.classList.contains('bx--dropdown--open')).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (document.body.contains(element)) {
         document.body.removeChild(element);
       }
diff --git a/packages/components/tests/spec/file-uploader_spec.js b/packages/components/tests/spec/file-uploader_spec.js
index b0b57604cb4e..845fc36ce0fb 100644
--- a/packages/components/tests/spec/file-uploader_spec.js
+++ b/packages/components/tests/spec/file-uploader_spec.js
@@ -2,13 +2,13 @@ import FileUploader from '../../src/components/file-uploader/file-uploader';
 import HTML from '../../html/file-uploader/file-uploader.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('File Uploader', function() {
-  describe('Constructor', function() {
+describe('File Uploader', function () {
+  describe('Constructor', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeAll(function() {
+    beforeAll(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -16,7 +16,7 @@ describe('File Uploader', function() {
       instance = new FileUploader(element);
     });
 
-    it('should throw if root element is not given', function() {
+    it('should throw if root element is not given', function () {
       expect(() => {
         new FileUploader();
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('File Uploader', function() {
       );
     });
 
-    it('should throw if root element is not a DOM element', function() {
+    it('should throw if root element is not a DOM element', function () {
       expect(() => {
         new FileUploader(document.createTextNode(''));
       }).toThrowError(
@@ -34,7 +34,7 @@ describe('File Uploader', function() {
       );
     });
 
-    it('should throw if the <input type="file"> is not found', function() {
+    it('should throw if the <input type="file"> is not found', function () {
       expect(() => {
         const div = document.createElement('div');
         div.innerHTML = `<div data-file-container></div>`;
@@ -42,7 +42,7 @@ describe('File Uploader', function() {
       }).toThrowError(TypeError, 'Cannot find the file input box.');
     });
 
-    it('should throw if the <div data-file-container> is not found', function() {
+    it('should throw if the <div data-file-container> is not found', function () {
       expect(() => {
         const div = document.createElement('div');
         div.innerHTML = `<input type="file" class="bx--file-input">`;
@@ -50,7 +50,7 @@ describe('File Uploader', function() {
       }).toThrowError(TypeError, 'Cannot find the file names container.');
     });
 
-    it('should set default options', function() {
+    it('should set default options', function () {
       expect(flattenOptions(instance.options)).toEqual({
         selectorInit: '[data-file]',
         selectorInput: 'input[type="file"].bx--file-input',
@@ -77,33 +77,33 @@ describe('File Uploader', function() {
       });
     });
 
-    it('should access container element', function() {
+    it('should access container element', function () {
       const container = element.querySelector('[data-file-container]');
       expect(instance.container).toBe(container);
     });
 
-    it('should access the input element', function() {
+    it('should access the input element', function () {
       const input = element.querySelector('input');
       expect(instance.input).toBe(input);
     });
 
-    it('should access id for input', function() {
+    it('should access id for input', function () {
       const input = element.querySelector('input');
       expect(instance.inputId).toBe(input.id);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('HTML methods', function() {
+  describe('HTML methods', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -111,7 +111,7 @@ describe('File Uploader', function() {
       instance = new FileUploader(element);
     });
 
-    it('_filenamesHTML method should use name', function() {
+    it('_filenamesHTML method should use name', function () {
       const filenamesHTML = instance._filenamesHTML('testName', 'testId');
       const div = document.createElement('div');
       div.innerHTML = filenamesHTML;
@@ -125,7 +125,7 @@ describe('File Uploader', function() {
       document.body.removeChild(div);
     });
 
-    it('_filenamesHTML method should use id param to for [data-for] attr', function() {
+    it('_filenamesHTML method should use id param to for [data-for] attr', function () {
       const filenamesHTML = instance._filenamesHTML('testName', 'testId');
       const div = document.createElement('div');
       div.innerHTML = filenamesHTML;
@@ -137,7 +137,7 @@ describe('File Uploader', function() {
       document.body.removeChild(div);
     });
 
-    it('_uploadHTML method should return expected HTML string', function() {
+    it('_uploadHTML method should return expected HTML string', function () {
       const uploadHTML = instance._uploadHTML();
       const div = document.createElement('div');
       div.innerHTML = uploadHTML;
@@ -151,7 +151,7 @@ describe('File Uploader', function() {
       document.body.removeChild(div);
     });
 
-    it('_closeButtonHTML method should return expected HTML string', function() {
+    it('_closeButtonHTML method should return expected HTML string', function () {
       const closeButtonHTML = instance._closeButtonHTML();
       const div = document.createElement('div');
       div.innerHTML = closeButtonHTML;
@@ -171,7 +171,7 @@ describe('File Uploader', function() {
       document.body.removeChild(div);
     });
 
-    it('_checkmarkHTML method should return expected HTML string', function() {
+    it('_checkmarkHTML method should return expected HTML string', function () {
       const checkmarkHTML = instance._checkmarkHTML();
       const div = document.createElement('div');
       div.innerHTML = checkmarkHTML;
@@ -189,18 +189,18 @@ describe('File Uploader', function() {
       document.body.removeChild(div);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_removeState()', function() {
+  describe('_removeState()', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -208,13 +208,13 @@ describe('File Uploader', function() {
       instance = new FileUploader(element);
     });
 
-    it('should throw if element param is not given', function() {
+    it('should throw if element param is not given', function () {
       expect(() => {
         instance._removeState(document.createTextNode(''));
       }).toThrowError(Error);
     });
 
-    it('should be called', function() {
+    it('should be called', function () {
       const parentEl = document.createElement('div');
       const childEl = document.createElement('span');
       parentEl.appendChild(childEl);
@@ -223,7 +223,7 @@ describe('File Uploader', function() {
       expect(instance._removeState).toHaveBeenCalled();
     });
 
-    it('should remove the firstChild of given element', function() {
+    it('should remove the firstChild of given element', function () {
       const parentEl = document.createElement('div');
       parentEl.classList.add('foo');
       const childEl = document.createElement('span');
@@ -234,18 +234,18 @@ describe('File Uploader', function() {
       document.body.removeChild(parentEl);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_getStateContainers', function() {
+  describe('_getStateContainers', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -253,13 +253,13 @@ describe('File Uploader', function() {
       instance = new FileUploader(element);
     });
 
-    it('should throw if stateContainers are empty', function() {
+    it('should throw if stateContainers are empty', function () {
       expect(() => {
         instance._getStateContainers();
       }).toThrowError(Error);
     });
 
-    it('should throw if id for input[type="file"] does not equal [data-for] attribute on state container', function() {
+    it('should throw if id for input[type="file"] does not equal [data-for] attribute on state container', function () {
       const filenameElement = instance._filenamesHTML('name', 'unmatching-id');
       instance.container.insertAdjacentHTML('beforeend', filenameElement);
       expect(() => {
@@ -267,7 +267,7 @@ describe('File Uploader', function() {
       }).toThrowError(Error);
     });
 
-    it('should be called', function() {
+    it('should be called', function () {
       const filenameElement = instance._filenamesHTML('name', instance.inputId);
       instance.container.insertAdjacentHTML('beforeend', filenameElement);
       spyOn(instance, '_getStateContainers');
@@ -275,21 +275,21 @@ describe('File Uploader', function() {
       expect(instance._getStateContainers).toHaveBeenCalled();
     });
 
-    it('should return an array', function() {
+    it('should return an array', function () {
       const filenameElement = instance._filenamesHTML('name', instance.inputId);
       instance.container.insertAdjacentHTML('beforeend', filenameElement);
       const array = instance._getStateContainers();
       expect(Array.isArray(array)).toBe(true);
     });
 
-    it('should have a length', function() {
+    it('should have a length', function () {
       const filenameElement = instance._filenamesHTML('name', instance.inputId);
       instance.container.insertAdjacentHTML('beforeend', filenameElement);
       const array = instance._getStateContainers();
       expect(array.length).toBe(1);
     });
 
-    it('should have an empty stateContainer', function() {
+    it('should have an empty stateContainer', function () {
       const filenameElement = instance._filenamesHTML('name', instance.inputId);
       instance.container.insertAdjacentHTML('beforeend', filenameElement);
       const stateContainer = document.querySelector(
@@ -298,18 +298,18 @@ describe('File Uploader', function() {
       expect(stateContainer.innerHTML).toBe('');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('Displaying filenames with _displayFilenames', function() {
+  describe('Displaying filenames with _displayFilenames', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeAll(function() {
+    beforeAll(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -317,7 +317,7 @@ describe('File Uploader', function() {
       instance = new FileUploader(element);
     });
 
-    it('should be called on input change event', function() {
+    it('should be called on input change event', function () {
       spyOn(instance, '_displayFilenames');
       instance.input.dispatchEvent(
         new CustomEvent('change', { bubbles: true })
@@ -326,18 +326,18 @@ describe('File Uploader', function() {
       expect(instance._displayFilenames).toHaveBeenCalled();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_handleStateChange', function() {
+  describe('_handleStateChange', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
 
       wrapper.innerHTML = HTML;
@@ -346,7 +346,7 @@ describe('File Uploader', function() {
       instance = new FileUploader(element);
     });
 
-    it('should be called', function() {
+    it('should be called', function () {
       const testHTML =
         '<ul><li class="test">...</li><li class="test">...</li></ul>';
       const div = document.createElement('div');
@@ -363,19 +363,19 @@ describe('File Uploader', function() {
       document.body.removeChild(div);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_handleDragDrop', function() {
+  describe('_handleDragDrop', function () {
     let instance;
     let element;
     let wrapper;
     let dropContainer;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -386,13 +386,13 @@ describe('File Uploader', function() {
       );
     });
 
-    it('should be called', function() {
+    it('should be called', function () {
       spyOn(instance, '_handleDragDrop');
       instance._handleDragDrop(new CustomEvent('change', { bubbles: true }));
       expect(instance._handleDragDrop).toHaveBeenCalled();
     });
 
-    it('should handle dragover event', function() {
+    it('should handle dragover event', function () {
       const dragover = new CustomEvent('dragover', {
         bubbles: true,
       });
@@ -412,7 +412,7 @@ describe('File Uploader', function() {
       ).toBe(true);
     });
 
-    it('should handle dragleave event', function() {
+    it('should handle dragleave event', function () {
       const dragleave = new CustomEvent('dragleave', {
         bubbles: true,
       });
@@ -432,7 +432,7 @@ describe('File Uploader', function() {
       ).toBe(false);
     });
 
-    it('should handle drop event', function() {
+    it('should handle drop event', function () {
       spyOn(instance, '_displayFilenames');
       const drop = new CustomEvent('drop', {
         bubbles: true,
@@ -454,7 +454,7 @@ describe('File Uploader', function() {
       ).toBe(false);
     });
 
-    it('should ignore events from other file uploaders', function() {
+    it('should ignore events from other file uploaders', function () {
       const dragover = new CustomEvent('dragover', {
         bubbles: true,
       });
@@ -486,7 +486,7 @@ describe('File Uploader', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
diff --git a/packages/components/tests/spec/floating-menu_spec.js b/packages/components/tests/spec/floating-menu_spec.js
index 0ce63b1ef171..efac506c29a3 100644
--- a/packages/components/tests/spec/floating-menu_spec.js
+++ b/packages/components/tests/spec/floating-menu_spec.js
@@ -2,9 +2,9 @@ import EventManager from '../utils/event-manager';
 import FloatingMenu from '../../src/components/floating-menu/floating-menu';
 import HTML from '../../html/overflow-menu/overflow-menu.html'; // Use .bx--overflow-menu-options for testing
 
-describe('Test floating menu', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test floating menu', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new FloatingMenu();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Test floating menu', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new FloatingMenu(document.createTextNode(''));
       }).toThrowError(
@@ -23,23 +23,23 @@ describe('Test floating menu', function() {
     });
   });
 
-  describe('Setting menu direction', function() {
+  describe('Setting menu direction', function () {
     let menu;
 
-    it('Should use bottom by default', function() {
+    it('Should use bottom by default', function () {
       expect(
         (menu = new FloatingMenu(document.createElement('div'))).options
           .direction
       ).toBe('bottom');
     });
 
-    it('Should read the direction from data-floating-menu-direction', function() {
+    it('Should read the direction from data-floating-menu-direction', function () {
       const element = document.createElement('div');
       element.dataset.floatingMenuDirection = 'left';
       expect((menu = new FloatingMenu(element)).options.direction).toBe('left');
     });
 
-    it('Should use options.direction over data-floating-menu-direction', function() {
+    it('Should use options.direction over data-floating-menu-direction', function () {
       const element = document.createElement('div');
       element.dataset.floatingMenuDirection = 'left';
       expect(
@@ -48,14 +48,14 @@ describe('Test floating menu', function() {
       ).toBe('right');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (menu) {
         menu = menu.release();
       }
     });
   });
 
-  describe('Showing/hiding', function() {
+  describe('Showing/hiding', function () {
     let menu;
     let element;
     let refNode;
@@ -63,7 +63,7 @@ describe('Test floating menu', function() {
     const tempDiv = document.createElement('div');
     tempDiv.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = tempDiv.querySelector('.bx--overflow-menu-options');
       document.body.appendChild(element);
       refNode = document.createElement('div');
@@ -75,7 +75,7 @@ describe('Test floating menu', function() {
       });
     });
 
-    it("Should sanity check show()'s arguments", function() {
+    it("Should sanity check show()'s arguments", function () {
       expect(() => {
         menu.show({});
       }).toThrowError(
@@ -84,7 +84,7 @@ describe('Test floating menu', function() {
       );
     });
 
-    it('Should have show() do nothing if already visible', function() {
+    it('Should have show() do nothing if already visible', function () {
       element.classList.add('my-floating-menu-open');
       const spy = jasmine.createSpy();
       events.on(element, 'floating-menu-beingshown', spy);
@@ -100,7 +100,7 @@ describe('Test floating menu', function() {
       expect(spy, 'floating-menu-beingshown event').not.toHaveBeenCalled();
     });
 
-    it('Should have show() method show menu', function() {
+    it('Should have show() method show menu', function () {
       const spy = jasmine.createSpy();
       events.on(menu.element, 'floating-menu-shown', spy);
       menu.show();
@@ -115,7 +115,7 @@ describe('Test floating menu', function() {
       expect(spy, 'floating-menu-shown event').toHaveBeenCalledTimes(1);
     });
 
-    it('Should call callback of show() method after it finishes', function() {
+    it('Should call callback of show() method after it finishes', function () {
       const spy = jasmine.createSpy();
       menu.show(spy);
       menu.element.dispatchEvent(
@@ -124,7 +124,7 @@ describe('Test floating menu', function() {
       expect(spy).toHaveBeenCalledTimes(1);
     });
 
-    it("Should sanity check hide()'s arguments", function() {
+    it("Should sanity check hide()'s arguments", function () {
       expect(() => {
         menu.hide({});
       }).toThrowError(
@@ -133,7 +133,7 @@ describe('Test floating menu', function() {
       );
     });
 
-    it('Should have hide() not hide if not visible already', function() {
+    it('Should have hide() not hide if not visible already', function () {
       const spy = jasmine.createSpy();
       events.on(element, 'floating-menu-beinghidden', spy);
       menu.hide();
@@ -151,7 +151,7 @@ describe('Test floating menu', function() {
       expect(spy, 'floating-menu-beinghidden event').not.toHaveBeenCalled();
     });
 
-    it('Should have hide() method hide menu', function() {
+    it('Should have hide() method hide menu', function () {
       menu.show();
       menu.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -170,7 +170,7 @@ describe('Test floating menu', function() {
       expect(spy, 'floating-menu-hidden event').toHaveBeenCalled();
     });
 
-    it('Should have changeState() do nothing if the new state is neither shown or nor hidden', function() {
+    it('Should have changeState() do nothing if the new state is neither shown or nor hidden', function () {
       const spyBeingShown = jasmine.createSpy();
       const spyBeingHidden = jasmine.createSpy();
       events.on(element, 'floating-menu-beingshown', spyBeingShown);
@@ -194,20 +194,20 @@ describe('Test floating menu', function() {
       ).not.toHaveBeenCalled();
     });
 
-    it("Should fire event on delegator node if it's given", function() {
+    it("Should fire event on delegator node if it's given", function () {
       const spy = jasmine.createSpy();
       events.on(refNode, 'floating-menu-shown', spy);
       menu.changeState('shown', { delegatorNode: refNode });
       expect(spy, 'floating-menu-shown event').toHaveBeenCalledTimes(1);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('my-floating-menu-open');
       refNode.classList.remove('my-floating-menu-trigger-open');
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (menu) {
         menu.release();
         menu = null;
@@ -227,14 +227,14 @@ describe('Test floating menu', function() {
     });
   });
 
-  describe('Placing menu', function() {
+  describe('Placing menu', function () {
     let menu;
     let element;
     let refNode;
     const tempDiv = document.createElement('div');
     tempDiv.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       window.pageXOffset = 0;
       window.pageYOffset = 0;
       element = tempDiv.querySelector('.bx--overflow-menu-options');
@@ -264,35 +264,35 @@ describe('Test floating menu', function() {
       });
     });
 
-    it('Should place the menu at the left', function() {
+    it('Should place the menu at the left', function () {
       menu.options.direction = 'left';
       menu.show();
       expect(element.style.left).toBe('-325px');
       expect(element.style.top).toBe('150px');
     });
 
-    it('Should place the menu at the top', function() {
+    it('Should place the menu at the top', function () {
       menu.options.direction = 'top';
       menu.show();
       expect(element.style.left).toBe('25px');
       expect(element.style.top).toBe('-250px');
     });
 
-    it('Should place the menu at the right', function() {
+    it('Should place the menu at the right', function () {
       menu.options.direction = 'right';
       menu.show();
       expect(element.style.left).toBe('325px');
       expect(element.style.top).toBe('150px');
     });
 
-    it('Should place the menu at the bottom', function() {
+    it('Should place the menu at the bottom', function () {
       menu.options.direction = 'bottom';
       menu.show();
       expect(element.style.left).toBe('25px');
       expect(element.style.top).toBe('450px');
     });
 
-    it('Should throw if refNode is not there', function() {
+    it('Should throw if refNode is not there', function () {
       menu.options.refNode = null;
       try {
         expect(() => {
@@ -306,12 +306,12 @@ describe('Test floating menu', function() {
       }
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('my-floating-menu-open');
       element.classList.remove('my-floating-menu-trigger-open');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (menu) {
         menu.release();
         menu = null;
@@ -331,7 +331,7 @@ describe('Test floating menu', function() {
     });
   });
 
-  describe('Moving menu into the container', function() {
+  describe('Moving menu into the container', function () {
     let menu;
     let element;
     let refNode;
@@ -340,12 +340,12 @@ describe('Test floating menu', function() {
     const tempDiv = document.createElement('div');
     tempDiv.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       refNode = document.createElement('div');
       document.body.appendChild(refNode);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       element = container.querySelector('.bx--overflow-menu-options');
@@ -357,18 +357,18 @@ describe('Test floating menu', function() {
       });
     });
 
-    it('Should move to body by default', function() {
+    it('Should move to body by default', function () {
       menu.show();
       expect(element.parentNode).toBe(document.body);
     });
 
-    it('Should move to element with data-floating-menu-container attribute', function() {
+    it('Should move to element with data-floating-menu-container attribute', function () {
       container.dataset.floatingMenuContainer = '';
       menu.show();
       expect(element.parentNode).toBe(container);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (menu) {
         menu.release();
         menu = null;
@@ -388,7 +388,7 @@ describe('Test floating menu', function() {
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (refNode) {
         if (refNode.parentNode) {
           refNode.parentNode.removeChild(refNode);
@@ -398,14 +398,14 @@ describe('Test floating menu', function() {
     });
   });
 
-  describe('Handling resize', function() {
+  describe('Handling resize', function () {
     let menu;
     let element;
     let refNode;
     const tempDiv = document.createElement('div');
     tempDiv.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = tempDiv.querySelector('.bx--overflow-menu-options');
       document.body.appendChild(element);
       refNode = document.createElement('div');
@@ -417,30 +417,30 @@ describe('Test floating menu', function() {
       });
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       spyOn(menu, '_place');
-      spyOn(window, 'requestAnimationFrame').and.callFake(callback => {
+      spyOn(window, 'requestAnimationFrame').and.callFake((callback) => {
         callback();
       });
     });
 
-    it('Should handle resizing while shown', function() {
+    it('Should handle resizing while shown', function () {
       menu.show();
       menu._place.calls.reset();
       window.dispatchEvent(new CustomEvent('resize'));
       expect(menu._place).toHaveBeenCalledTimes(1);
     });
 
-    it('Should not handle resizing while hidden', function() {
+    it('Should not handle resizing while hidden', function () {
       window.dispatchEvent(new CustomEvent('resize'));
       expect(menu._place).not.toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       menu.hide();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (menu) {
         menu.release();
         menu = null;
@@ -460,7 +460,7 @@ describe('Test floating menu', function() {
     });
   });
 
-  describe('Managing focus', function() {
+  describe('Managing focus', function () {
     let menu;
     let element;
     let primaryFocusNode;
@@ -469,7 +469,7 @@ describe('Test floating menu', function() {
     const tempDiv = document.createElement('div');
     tempDiv.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = tempDiv.querySelector('.bx--overflow-menu-options');
       document.body.appendChild(element);
       primaryFocusNode = element.querySelector(
@@ -486,7 +486,7 @@ describe('Test floating menu', function() {
       });
     });
 
-    it('Should close menu when both the trigger button and the menu lose focus', function() {
+    it('Should close menu when both the trigger button and the menu lose focus', function () {
       primaryFocusNode.focus();
       menu.changeState('shown', {});
       input.focus();
@@ -495,7 +495,7 @@ describe('Test floating menu', function() {
       ).toBe(false);
     });
 
-    it('Should focus back on the trigger button when floating menu loses focus', function() {
+    it('Should focus back on the trigger button when floating menu loses focus', function () {
       const hasFocusin = 'onfocusin' in window;
       const focusinEventName = hasFocusin ? 'focusin' : 'focus';
       menu.changeState('shown', {});
@@ -509,11 +509,11 @@ describe('Test floating menu', function() {
       expect(HTMLElement.prototype.focus).toHaveBeenCalledTimes(1);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('bx--overflow-menu-options--open');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (menu) {
         menu = menu.release();
       }
diff --git a/packages/components/tests/spec/header-nav_spec.js b/packages/components/tests/spec/header-nav_spec.js
index ae8f08e465f3..2a24fbcf584a 100644
--- a/packages/components/tests/spec/header-nav_spec.js
+++ b/packages/components/tests/spec/header-nav_spec.js
@@ -1,6 +1,6 @@
 import HeaderNav from '../../src/components/ui-shell/header-nav';
 
-describe('HeaderNav', function() {
+describe('HeaderNav', function () {
   let headerNav;
   let nav;
   let ul;
@@ -9,7 +9,7 @@ describe('HeaderNav', function() {
   let a1;
   let a2;
 
-  beforeAll(function() {
+  beforeAll(function () {
     nav = document.createElement('nav');
     nav.className = 'bx--header__nav';
     ul = document.createElement('ul');
@@ -30,13 +30,13 @@ describe('HeaderNav', function() {
     document.body.appendChild(nav);
   });
 
-  beforeEach(function() {
+  beforeEach(function () {
     // TODO: investigate
     a1.setAttribute('tabindex', 0);
     a1.focus();
   });
 
-  describe('Left/Right arrow keys', function() {
+  describe('Left/Right arrow keys', function () {
     const leftArrowKeydown = new KeyboardEvent('keydown', { bubbles: true });
     Object.defineProperty(leftArrowKeydown, 'which', {
       value: 37,
@@ -48,14 +48,14 @@ describe('HeaderNav', function() {
       writable: true,
     });
 
-    describe('right arrow keydown', function() {
-      it('should move to next submenu with right arrow key', function() {
+    describe('right arrow keydown', function () {
+      it('should move to next submenu with right arrow key', function () {
         spyOn(a2, 'focus');
         a1.dispatchEvent(rightArrowKeydown);
         expect(a2.focus).toHaveBeenCalled();
       });
 
-      it('should wrap to first submenu when navigating from end of list', function() {
+      it('should wrap to first submenu when navigating from end of list', function () {
         // TODO: investigate
         a2.setAttribute('tabindex', 0);
         a2.focus();
@@ -65,8 +65,8 @@ describe('HeaderNav', function() {
       });
     });
 
-    describe('left arrow keydown', function() {
-      it('should move to previous submenu with left arrow key', function() {
+    describe('left arrow keydown', function () {
+      it('should move to previous submenu with left arrow key', function () {
         // TODO: investigate
         a2.setAttribute('tabindex', 0);
         a2.focus();
@@ -75,7 +75,7 @@ describe('HeaderNav', function() {
         expect(a1.focus).toHaveBeenCalled();
       });
 
-      it('should wrap to last submenu when navigating from start of list', function() {
+      it('should wrap to last submenu when navigating from start of list', function () {
         spyOn(a2, 'focus');
         a1.dispatchEvent(rightArrowKeydown);
         expect(a2.focus).toHaveBeenCalled();
@@ -83,7 +83,7 @@ describe('HeaderNav', function() {
     });
   });
 
-  afterAll(function() {
+  afterAll(function () {
     headerNav.release();
     document.body.removeChild(nav);
   });
diff --git a/packages/components/tests/spec/header-submenu_spec.js b/packages/components/tests/spec/header-submenu_spec.js
index b095adae34f2..304851598685 100644
--- a/packages/components/tests/spec/header-submenu_spec.js
+++ b/packages/components/tests/spec/header-submenu_spec.js
@@ -1,8 +1,8 @@
 import HeaderSubmenu from '../../src/components/ui-shell/header-submenu';
 
-describe('Header Submenu', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Header Submenu', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new HeaderSubmenu();
       }).toThrowError(
@@ -11,7 +11,7 @@ describe('Header Submenu', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new HeaderSubmenu(document.createTextNode(''));
       }).toThrowError(
@@ -21,13 +21,13 @@ describe('Header Submenu', function() {
     });
   });
 
-  describe('Click handler', function() {
+  describe('Click handler', function () {
     let headerSubmenu;
     let element;
     let triggerNode;
     let itemLinkNode;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('li');
       triggerNode = document.createElement('a');
       triggerNode.classList.add('bx--header__menu-title');
@@ -45,36 +45,36 @@ describe('Header Submenu', function() {
       document.body.appendChild(element);
     });
 
-    it('should do nothing on menu title click', function() {
+    it('should do nothing on menu title click', function () {
       triggerNode.setAttribute('aria-expanded', 'false');
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
     });
 
-    it('should close menu when clicking on an item', function() {
+    it('should close menu when clicking on an item', function () {
       triggerNode.setAttribute('aria-expanded', 'true');
       itemLinkNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       triggerNode.setAttribute('aria-expanded', 'false');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       headerSubmenu.release();
       document.body.removeChild(element);
     });
   });
 
-  describe('Handle blur', function() {
+  describe('Handle blur', function () {
     let headerSubmenu;
     let element;
     let triggerNode;
     let input;
     let itemLinkNode;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('li');
       triggerNode = document.createElement('a');
       triggerNode.setAttribute('href', '#');
@@ -99,11 +99,11 @@ describe('Header Submenu', function() {
       document.body.appendChild(input);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       triggerNode.setAttribute('aria-expanded', 'true');
     });
 
-    it('should close menu when another element is focused or when document is clicked', function() {
+    it('should close menu when another element is focused or when document is clicked', function () {
       // TODO: mock CustomEvent for IE
       const customEvent = new CustomEvent('blur', { bubbles: true });
       Object.defineProperty(customEvent, 'relatedTarget', {
@@ -114,18 +114,18 @@ describe('Header Submenu', function() {
       expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       triggerNode.setAttribute('aria-expanded', 'false');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       headerSubmenu.release();
       document.body.removeChild(element);
       document.body.removeChild(input);
     });
   });
 
-  describe('Handle keydown', function() {
+  describe('Handle keydown', function () {
     let headerSubmenu;
     let element1;
     let triggerNode;
@@ -136,7 +136,7 @@ describe('Header Submenu', function() {
     let itemLinkNode2;
     let element2;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element1 = document.createElement('li');
       element1.classList.add('bx--header__submenu');
       triggerNode = document.createElement('a');
@@ -161,7 +161,7 @@ describe('Header Submenu', function() {
       document.body.appendChild(element2);
     });
 
-    describe('Arrow keys', function() {
+    describe('Arrow keys', function () {
       const upArrowKeydown = new KeyboardEvent('keydown', { bubbles: true });
       Object.defineProperty(upArrowKeydown, 'which', {
         value: 38,
@@ -173,8 +173,8 @@ describe('Header Submenu', function() {
         writable: true,
       });
 
-      describe('Up/Down arrow keys', function() {
-        it('should move focus from currently focused item to previous menu item', function() {
+      describe('Up/Down arrow keys', function () {
+        it('should move focus from currently focused item to previous menu item', function () {
           spyOn(itemLinkNode2, 'focus');
           triggerNode.setAttribute('aria-expanded', 'true');
           triggerNode.dispatchEvent(upArrowKeydown);
@@ -183,7 +183,7 @@ describe('Header Submenu', function() {
           expect(itemLinkNode2.focus).toHaveBeenCalledTimes(1);
         });
 
-        it('should wrap focus from first menu item to last menu item', function() {
+        it('should wrap focus from first menu item to last menu item', function () {
           spyOn(itemLinkNode1, 'focus');
           spyOn(itemLinkNode2, 'focus');
           triggerNode.setAttribute('aria-expanded', 'true');
@@ -194,12 +194,12 @@ describe('Header Submenu', function() {
           expect(itemLinkNode2.focus).toHaveBeenCalledTimes(1);
         });
 
-        it('should not open menu when menu is focused', function() {
+        it('should not open menu when menu is focused', function () {
           triggerNode.dispatchEvent(downArrowKeydown);
           expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
         });
 
-        it('should move focus from currently focused item to next menu item', function() {
+        it('should move focus from currently focused item to next menu item', function () {
           // TODO: figure out why we need to set tabindex
           itemLinkNode1.setAttribute('tabindex', 0);
           spyOn(itemLinkNode2, 'focus');
@@ -210,7 +210,7 @@ describe('Header Submenu', function() {
           expect(itemLinkNode2.focus).toHaveBeenCalledTimes(1);
         });
 
-        it('should wrap focus from last menu item to first menu item', function() {
+        it('should wrap focus from last menu item to first menu item', function () {
           // TODO: figure out why we need to set tabindex
           itemLinkNode2.setAttribute('tabindex', 0);
           spyOn(itemLinkNode1, 'focus');
@@ -223,63 +223,63 @@ describe('Header Submenu', function() {
       });
     });
 
-    describe('Esc key', function() {
+    describe('Esc key', function () {
       const escKeydown = new KeyboardEvent('keydown', { bubbles: true });
       Object.defineProperty(escKeydown, 'which', { value: 27, writable: true });
 
-      it('should close menu with ESC key when menu is focused', function() {
+      it('should close menu with ESC key when menu is focused', function () {
         triggerNode.setAttribute('aria-expanded', 'true');
         triggerNode.dispatchEvent(escKeydown);
         expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
       });
 
-      it('should close menu with ESC key when an item is focused', function() {
+      it('should close menu with ESC key when an item is focused', function () {
         triggerNode.setAttribute('aria-expanded', 'true');
         itemNode1.dispatchEvent(escKeydown);
         expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
       });
 
-      it('should not open menu with ESC key', function() {
+      it('should not open menu with ESC key', function () {
         triggerNode.dispatchEvent(escKeydown);
         expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
       });
     });
 
-    describe('Space bar', function() {
+    describe('Space bar', function () {
       const spaceBarDown = new KeyboardEvent('keydown', { bubbles: true });
       Object.defineProperty(spaceBarDown, 'which', {
         value: 32,
         writable: true,
       });
 
-      it('should open menu with space bar', function() {
+      it('should open menu with space bar', function () {
         triggerNode.dispatchEvent(spaceBarDown);
         expect(triggerNode.getAttribute('aria-expanded')).toBe('true');
       });
 
-      it('should close menu with space key', function() {
+      it('should close menu with space key', function () {
         triggerNode.setAttribute('aria-expanded', 'true');
         triggerNode.dispatchEvent(spaceBarDown);
         expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
       });
 
-      it('should not close menu with space key on an item', function() {
+      it('should not close menu with space key on an item', function () {
         itemNode1.dispatchEvent(spaceBarDown);
         expect(triggerNode.getAttribute('aria-expanded')).toBe('true');
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       triggerNode.setAttribute('aria-expanded', 'false');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       headerSubmenu.release();
       document.body.removeChild(element1);
     });
   });
 
-  describe('Handle mouse event', function() {
+  describe('Handle mouse event', function () {
     let headerSubmenu;
     let element1;
     let triggerNode;
@@ -292,7 +292,7 @@ describe('Header Submenu', function() {
     const mouseEnter = new MouseEvent('mouseenter', { bubbles: true });
     const mouseLeave = new MouseEvent('mouseleave', { bubbles: true });
 
-    beforeAll(function() {
+    beforeAll(function () {
       element1 = document.createElement('li');
       element1.classList.add('bx--header__submenu');
       triggerNode = document.createElement('a');
@@ -317,36 +317,36 @@ describe('Header Submenu', function() {
       document.body.appendChild(element2);
     });
 
-    it('should close menu on mouseleave', function() {
+    it('should close menu on mouseleave', function () {
       triggerNode.setAttribute('aria-expanded', 'true');
       triggerNode.dispatchEvent(mouseLeave);
       expect(triggerNode.getAttribute('aria-expanded')).toBe('false');
     });
 
-    it('should open menu on mouseenter', function() {
+    it('should open menu on mouseenter', function () {
       triggerNode.setAttribute('aria-expanded', 'false');
       triggerNode.dispatchEvent(mouseEnter);
       expect(triggerNode.getAttribute('aria-expanded')).toBe('true');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       triggerNode.setAttribute('aria-expanded', 'false');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       headerSubmenu.release();
       document.body.removeChild(element1);
     });
   });
 
-  describe('Handle unknown events', function() {
+  describe('Handle unknown events', function () {
     let headerSubmenu;
     let element;
     let triggerNode;
     let itemLinkNode;
     let unknownEvent;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('li');
       triggerNode = document.createElement('a');
       triggerNode.classList.add('bx--header__menu-title');
@@ -373,27 +373,27 @@ describe('Header Submenu', function() {
       });
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       triggerNode.setAttribute('aria-expanded', 'false');
     });
 
-    it('should gracefully ignore unknown events', function() {
+    it('should gracefully ignore unknown events', function () {
       const getAction = headerSubmenu._getAction(unknownEvent);
       expect(getAction).toEqual(null);
     });
 
-    it('should not change state upon unknown events', function() {
+    it('should not change state upon unknown events', function () {
       const action = headerSubmenu._getAction(unknownEvent);
       const state = headerSubmenu._getNewState(action);
       expect(state).toEqual(false);
     });
 
-    it('should handle unknown keypress', function() {
+    it('should handle unknown keypress', function () {
       const unknownKeypress = headerSubmenu._handleKeyDown(unknownEvent);
       expect(unknownKeypress).toEqual(undefined);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       headerSubmenu.release();
       document.body.removeChild(element);
     });
diff --git a/packages/components/tests/spec/inline-loading_spec.js b/packages/components/tests/spec/inline-loading_spec.js
index d5211ad6c031..ff34b23cb61b 100644
--- a/packages/components/tests/spec/inline-loading_spec.js
+++ b/packages/components/tests/spec/inline-loading_spec.js
@@ -1,9 +1,9 @@
 import InlineLoading from '../../src/components/inline-loading/inline-loading';
 import InlineLoadingHTML from '../../html/inline-loading/inline-loading.html';
 
-describe('Test Inline Loading', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test Inline Loading', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new InlineLoading();
       }).toThrowError(
@@ -12,7 +12,7 @@ describe('Test Inline Loading', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new InlineLoading(document.createTextNode(''));
       }).toThrowError(
@@ -22,16 +22,16 @@ describe('Test Inline Loading', function() {
     });
   });
 
-  describe('Setting state', function() {
+  describe('Setting state', function () {
     let elem;
     let instance;
 
-    beforeEach(function() {
+    beforeEach(function () {
       elem = document.createElement('div');
       elem.innerHTML = InlineLoadingHTML;
     });
 
-    it('Should support setting the initial state via options', function() {
+    it('Should support setting the initial state via options', function () {
       instance = new InlineLoading(
         elem.querySelector('[data-inline-loading]'),
         { initialState: 'active' }
@@ -71,7 +71,7 @@ describe('Test Inline Loading', function() {
       ).toBe(true);
     });
 
-    it('Should hide everything but spinner when the state is set to inactive', function() {
+    it('Should hide everything but spinner when the state is set to inactive', function () {
       instance = new InlineLoading(
         elem.querySelector('[data-inline-loading]')
       ).setState('inactive');
@@ -110,7 +110,7 @@ describe('Test Inline Loading', function() {
       ).toBe(true);
     });
 
-    it('Should hide elements for finished states when the state is set to active', function() {
+    it('Should hide elements for finished states when the state is set to active', function () {
       instance = new InlineLoading(
         elem.querySelector('[data-inline-loading]')
       ).setState('active');
@@ -149,7 +149,7 @@ describe('Test Inline Loading', function() {
       ).toBe(true);
     });
 
-    it('Should hide elements for active states when the state is set to finished', function() {
+    it('Should hide elements for active states when the state is set to finished', function () {
       instance = new InlineLoading(
         elem.querySelector('[data-inline-loading]')
       ).setState('finished');
@@ -188,7 +188,7 @@ describe('Test Inline Loading', function() {
       ).toBe(true);
     });
 
-    it('Should hide elements for active states when the state is set to error', function() {
+    it('Should hide elements for active states when the state is set to error', function () {
       instance = new InlineLoading(
         elem.querySelector('[data-inline-loading]')
       ).setState('error');
@@ -227,7 +227,7 @@ describe('Test Inline Loading', function() {
       ).toBe(false);
     });
 
-    it('Should throw if a wrong state is passed in', function() {
+    it('Should throw if a wrong state is passed in', function () {
       instance = new InlineLoading(document.createElement('div'));
       expect(() => instance.setState()).toThrowError(
         Error,
@@ -239,12 +239,12 @@ describe('Test Inline Loading', function() {
       );
     });
 
-    it('Should return self', function() {
+    it('Should return self', function () {
       instance = new InlineLoading(document.createElement('div'));
       expect(instance.setState('active')).toBe(instance);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (instance) {
         instance = instance.release();
       }
@@ -254,14 +254,14 @@ describe('Test Inline Loading', function() {
     });
   });
 
-  describe('Managing instances', function() {
+  describe('Managing instances', function () {
     let element;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('a');
     });
 
-    it('Should prevent creating duplicate instances', function() {
+    it('Should prevent creating duplicate instances', function () {
       let first;
       let second;
       try {
@@ -276,7 +276,7 @@ describe('Test Inline Loading', function() {
       }
     });
 
-    it('Should let create a new instance for an element if an earlier one has been released', function() {
+    it('Should let create a new instance for an element if an earlier one has been released', function () {
       let first;
       let second;
       try {
diff --git a/packages/components/tests/spec/loading_spec.js b/packages/components/tests/spec/loading_spec.js
index 199f0ecbb565..43674749639d 100644
--- a/packages/components/tests/spec/loading_spec.js
+++ b/packages/components/tests/spec/loading_spec.js
@@ -1,9 +1,9 @@
 import Loading from '../../src/components/loading/loading';
 import LoadingHTML from '../../html/loading/loading.html';
 
-describe('Test Loading', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test Loading', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Loading();
       }).toThrowError(
@@ -12,7 +12,7 @@ describe('Test Loading', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Loading(document.createTextNode(''));
       }).toThrowError(
@@ -21,20 +21,20 @@ describe('Test Loading', function() {
       );
     });
 
-    it('Should set default state to active', function() {
+    it('Should set default state to active', function () {
       const spinner = new Loading(document.createElement('div'));
       expect(spinner.isActive()).toBe(true);
     });
 
-    it('Should accept options', function() {
+    it('Should accept options', function () {
       const options = { active: false };
       const spinner = new Loading(document.createElement('div'), options);
       expect(spinner.isActive()).toBe(false);
     });
   });
 
-  describe('set()', function() {
-    it('Should throw if boolean is not passed in', function() {
+  describe('set()', function () {
+    it('Should throw if boolean is not passed in', function () {
       const spinner = new Loading(document.createElement('div'));
       expect(() => spinner.set()).toThrowError(
         TypeError,
@@ -46,7 +46,7 @@ describe('Test Loading', function() {
       );
     });
 
-    it('Should set state', function() {
+    it('Should set state', function () {
       const spinner = new Loading(document.createElement('div'));
       spinner.set(true);
       expect(spinner.isActive()).toBe(true);
@@ -54,12 +54,12 @@ describe('Test Loading', function() {
       expect(spinner.isActive()).toBe(false);
     });
 
-    it('Should return self', function() {
+    it('Should return self', function () {
       const spinner = new Loading(document.createElement('div'));
       expect(spinner.set(true)).toBe(spinner);
     });
 
-    it('Should remove and add bx--loading--stop class attribute of DOM element', function() {
+    it('Should remove and add bx--loading--stop class attribute of DOM element', function () {
       const spinner = new Loading(document.createElement('div'));
       spinner.set(false);
       expect(
@@ -75,8 +75,8 @@ describe('Test Loading', function() {
     });
   });
 
-  describe('toggle()', function() {
-    it('Should toggle', function() {
+  describe('toggle()', function () {
+    it('Should toggle', function () {
       const spinner = new Loading(document.createElement('div'));
       spinner.toggle();
       expect(spinner.isActive()).toBe(false);
@@ -85,19 +85,19 @@ describe('Test Loading', function() {
     });
   });
 
-  describe('isActive()', function() {
-    it('Should return spinner state', function() {
+  describe('isActive()', function () {
+    it('Should return spinner state', function () {
       const spinner = new Loading(document.createElement('div'));
       expect(spinner.isActive()).toBe(true);
     });
   });
 
-  describe('_deleteElement()', function() {
+  describe('_deleteElement()', function () {
     let element;
     let instance;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = LoadingHTML;
       document.body.appendChild(wrapper);
@@ -105,30 +105,30 @@ describe('Test Loading', function() {
       instance = new Loading(element);
     });
 
-    it('Should be called', function() {
+    it('Should be called', function () {
       spyOn(instance, '_deleteElement');
       instance._deleteElement();
       expect(instance._deleteElement).toHaveBeenCalled();
     });
 
-    it('Should remove loading element from the DOM', function() {
+    it('Should remove loading element from the DOM', function () {
       instance._deleteElement();
       const loadingEl = document.querySelector('[data-loading]');
       expect(loadingEl).toBe(null);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('end()', function() {
+  describe('end()', function () {
     let element;
     let instance;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = LoadingHTML;
       document.body.appendChild(wrapper);
@@ -136,31 +136,31 @@ describe('Test Loading', function() {
       instance = new Loading(element);
     });
 
-    it('Should be called', function() {
+    it('Should be called', function () {
       spyOn(instance, 'end');
       instance.end();
       expect(instance.end).toHaveBeenCalled();
     });
 
-    it('Should set state to inactive', function() {
+    it('Should set state to inactive', function () {
       instance.end();
       expect(instance.isActive()).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('Managing instances', function() {
+  describe('Managing instances', function () {
     let element;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('a');
     });
 
-    it('Should prevent creating duplicate instances', function() {
+    it('Should prevent creating duplicate instances', function () {
       let first;
       let second;
       try {
@@ -175,7 +175,7 @@ describe('Test Loading', function() {
       }
     });
 
-    it('Should let create a new instance for an element if an earlier one has been released', function() {
+    it('Should let create a new instance for an element if an earlier one has been released', function () {
       let first;
       let second;
       try {
diff --git a/packages/components/tests/spec/misc/on-focus-by-keyboard_spec.js b/packages/components/tests/spec/misc/on-focus-by-keyboard_spec.js
index 28a92991dfb8..a614dec2a07f 100644
--- a/packages/components/tests/spec/misc/on-focus-by-keyboard_spec.js
+++ b/packages/components/tests/spec/misc/on-focus-by-keyboard_spec.js
@@ -1,13 +1,13 @@
 import onFocusByKeyboard from '../../../src/globals/js/misc/on-focus-by-keyboard';
 
-describe('onFocusByKeyboard', function() {
+describe('onFocusByKeyboard', function () {
   let input1;
   let input2;
   let container;
   let spy;
   let eventHandler;
 
-  beforeAll(function() {
+  beforeAll(function () {
     input1 = document.createElement('input');
     input2 = document.createElement('input');
     input1.type = 'text';
@@ -18,32 +18,32 @@ describe('onFocusByKeyboard', function() {
     document.body.appendChild(container);
   });
 
-  it('should call event handler with keyboard based focus', function() {
+  it('should call event handler with keyboard based focus', function () {
     spy = jasmine.createSpy('focus');
     eventHandler = onFocusByKeyboard(container, 'focus', spy);
     container.dispatchEvent(new FocusEvent('focus', { bubbles: true }));
     expect(spy.calls.count()).toEqual(1);
   });
 
-  it('should call event handler with keyboard based blur', function() {
+  it('should call event handler with keyboard based blur', function () {
     spy = jasmine.createSpy('blur');
     eventHandler = onFocusByKeyboard(container, 'blur', spy);
     container.dispatchEvent(new FocusEvent('blur', { bubbles: true }));
     expect(spy.calls.count()).toEqual(1);
   });
 
-  it('should handle unsupported events', function() {
+  it('should handle unsupported events', function () {
     spy = jasmine.createSpy('blur');
     eventHandler = onFocusByKeyboard(container, 'blur', spy);
     container.dispatchEvent(new CustomEvent('unknown', { bubbles: true }));
     expect(spy).not.toHaveBeenCalled();
   });
 
-  it('should throw an error on unsupported events', function() {
+  it('should throw an error on unsupported events', function () {
     expect(() => onFocusByKeyboard(container, 'click', () => {})).toThrow();
   });
 
-  it('should detect focus events caused by mouse', function() {
+  it('should detect focus events caused by mouse', function () {
     spy = jasmine.createSpy('focus');
     eventHandler = onFocusByKeyboard(container, 'focus', spy);
     container.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
@@ -51,7 +51,7 @@ describe('onFocusByKeyboard', function() {
     expect(spy).not.toHaveBeenCalled();
   });
 
-  it('should detect blur events caused by mouse', function() {
+  it('should detect blur events caused by mouse', function () {
     spy = jasmine.createSpy('blur');
     eventHandler = onFocusByKeyboard(container, 'blur', spy);
     container.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
@@ -59,14 +59,14 @@ describe('onFocusByKeyboard', function() {
     expect(spy).not.toHaveBeenCalled();
   });
 
-  afterEach(function() {
+  afterEach(function () {
     if (eventHandler) {
       eventHandler.release();
     }
     eventHandler = null;
   });
 
-  afterAll(function() {
+  afterAll(function () {
     document.body.removeChild(container);
   });
 });
diff --git a/packages/components/tests/spec/misc/svg-toggle-class_spec.js b/packages/components/tests/spec/misc/svg-toggle-class_spec.js
index 518d7b0be732..f6e2101d00ef 100644
--- a/packages/components/tests/spec/misc/svg-toggle-class_spec.js
+++ b/packages/components/tests/spec/misc/svg-toggle-class_spec.js
@@ -1,39 +1,39 @@
 import svgToggleClass from '../../../src/globals/js/misc/svg-toggle-class';
 
-describe('Test toggling class for <svg>', function() {
+describe('Test toggling class for <svg>', function () {
   const svg = document.createElement('svg');
 
-  it('Should add class for toggling', function() {
+  it('Should add class for toggling', function () {
     svg.setAttribute('class', 'foo bar');
     svgToggleClass(svg, 'baz');
     expect(svg.getAttribute('class')).toBe('foo bar baz');
   });
 
-  it('Should remove class for toggling', function() {
+  it('Should remove class for toggling', function () {
     svg.setAttribute('class', 'foo bar');
     svgToggleClass(svg, 'foo');
     expect(svg.getAttribute('class')).toBe('bar');
   });
 
-  it('Should add class if specified', function() {
+  it('Should add class if specified', function () {
     svg.setAttribute('class', 'foo bar');
     svgToggleClass(svg, 'baz', true);
     expect(svg.getAttribute('class')).toBe('foo bar baz');
   });
 
-  it('Should remove class if specified', function() {
+  it('Should remove class if specified', function () {
     svg.setAttribute('class', 'foo bar');
     svgToggleClass(svg, 'foo', false);
     expect(svg.getAttribute('class')).toBe('bar');
   });
 
-  it('Should sanitize upon edit', function() {
+  it('Should sanitize upon edit', function () {
     svg.setAttribute('class', ' foo bar  foo ');
     svgToggleClass(svg, 'baz', true);
     expect(svg.getAttribute('class')).toBe('foo bar baz');
   });
 
-  it('Should keep class attribute intact if there is no edit', function() {
+  it('Should keep class attribute intact if there is no edit', function () {
     svg.setAttribute('class', ' foo bar  foo ');
     svgToggleClass(svg, 'baz', false);
     expect(svg.getAttribute('class')).toBe(' foo bar  foo ');
diff --git a/packages/components/tests/spec/mixins/init-component-by-launcher_spec.js b/packages/components/tests/spec/mixins/init-component-by-launcher_spec.js
index 89bc5b4aea67..1e756824f769 100644
--- a/packages/components/tests/spec/mixins/init-component-by-launcher_spec.js
+++ b/packages/components/tests/spec/mixins/init-component-by-launcher_spec.js
@@ -2,7 +2,7 @@ import mixin from '../../../src/globals/js/misc/mixin';
 import initComponentByLauncher from '../../../src/globals/js/mixins/init-component-by-launcher';
 import EventManager from '../../utils/event-manager';
 
-describe('Test init component by launcher', function() {
+describe('Test init component by launcher', function () {
   let container;
   let launcherButton;
   let context;
@@ -25,7 +25,7 @@ describe('Test init component by launcher', function() {
     createdByLauncher = spyCreatedByLauncher;
   };
 
-  it('Should throw if given element is null', function() {
+  it('Should throw if given element is null', function () {
     expect(() => {
       Class.init(null);
     }).toThrowError(
@@ -34,7 +34,7 @@ describe('Test init component by launcher', function() {
     );
   });
 
-  it('Should throw if given element is neither a DOM element or a document', function() {
+  it('Should throw if given element is neither a DOM element or a document', function () {
     expect(() => {
       Class.init(document.createTextNode(''));
     }).toThrowError(
@@ -43,7 +43,7 @@ describe('Test init component by launcher', function() {
     );
   });
 
-  it('Should do nothing if there is no target modals for a button upon button click', function() {
+  it('Should do nothing if there is no target modals for a button upon button click', function () {
     launcherButton = document.createElement('a');
     document.body.appendChild(launcherButton);
     expect(
@@ -53,14 +53,14 @@ describe('Test init component by launcher', function() {
     ).toBe(true);
   });
 
-  it('Should create an instance if the given element is of the widget', function() {
+  it('Should create an instance if the given element is of the widget', function () {
     container = document.createElement('div');
     container.dataset.myComponent = '';
     context = Class.init(container, initOptions);
     expect(spyCreate.calls.allArgs()).toEqual([[container, initOptions]]);
   });
 
-  it('Should throw if launcher targets to multiple components', function() {
+  it('Should throw if launcher targets to multiple components', function () {
     const origOnError = window.onError;
     window.onerror = null; // Mocha sets its own global `onerror` handler that causes test to fail
     try {
@@ -84,7 +84,7 @@ describe('Test init component by launcher', function() {
     }
   });
 
-  it('Should launch the component', function() {
+  it('Should launch the component', function () {
     container = document.createElement('div');
     container.dataset.myComponent = '';
     document.body.appendChild(container);
@@ -104,7 +104,7 @@ describe('Test init component by launcher', function() {
     ).toHaveBeenCalledTimes(1);
   });
 
-  it('Should cancel the event if launcher button is <a>', function() {
+  it('Should cancel the event if launcher button is <a>', function () {
     container = document.createElement('div');
     container.dataset.myComponent = '';
     document.body.appendChild(container);
@@ -119,7 +119,7 @@ describe('Test init component by launcher', function() {
     ).toBe(false);
   });
 
-  afterEach(function() {
+  afterEach(function () {
     spyCreatedByLauncher.calls.reset();
     spyCreate.calls.reset();
     events.reset();
diff --git a/packages/components/tests/spec/mixins/init-component-by-search_spec.js b/packages/components/tests/spec/mixins/init-component-by-search_spec.js
index f71bcf223aeb..2edc17c50d3e 100644
--- a/packages/components/tests/spec/mixins/init-component-by-search_spec.js
+++ b/packages/components/tests/spec/mixins/init-component-by-search_spec.js
@@ -1,7 +1,7 @@
 import mixin from '../../../src/globals/js/misc/mixin';
 import initComponentBySearch from '../../../src/globals/js/mixins/init-component-by-search';
 
-describe('Test init component by search', function() {
+describe('Test init component by search', function () {
   let container;
   const spyCreate = jasmine.createSpy();
   const options = { foo: 'Foo' };
@@ -15,7 +15,7 @@ describe('Test init component by search', function() {
     static components = new WeakMap();
   };
 
-  it('Should throw if given element is null', function() {
+  it('Should throw if given element is null', function () {
     expect(() => {
       Class.init(null);
     }).toThrowError(
@@ -24,7 +24,7 @@ describe('Test init component by search', function() {
     );
   });
 
-  it('Should throw if given element is neither a DOM element or a document', function() {
+  it('Should throw if given element is neither a DOM element or a document', function () {
     expect(() => {
       Class.init(document.createTextNode(''));
     }).toThrowError(
@@ -33,7 +33,7 @@ describe('Test init component by search', function() {
     );
   });
 
-  it('Should search from document if root element is not given', function() {
+  it('Should search from document if root element is not given', function () {
     container = document.createElement('div');
     container.dataset.myComponent = '';
     document.body.appendChild(container);
@@ -41,7 +41,7 @@ describe('Test init component by search', function() {
     expect(spyCreate.calls.allArgs()).toEqual([[container, {}]]);
   });
 
-  it('Should search from document if document node is given', function() {
+  it('Should search from document if document node is given', function () {
     container = document.createElement('div');
     container.dataset.myComponent = '';
     document.body.appendChild(container);
@@ -49,14 +49,14 @@ describe('Test init component by search', function() {
     expect(spyCreate.calls.allArgs()).toEqual([[container, options]]);
   });
 
-  it('Should create an instance if the given element is of the widget', function() {
+  it('Should create an instance if the given element is of the widget', function () {
     container = document.createElement('div');
     container.dataset.myComponent = '';
     Class.init(container, options);
     expect(spyCreate.calls.allArgs()).toEqual([[container, options]]);
   });
 
-  afterEach(function() {
+  afterEach(function () {
     spyCreate.calls.reset();
     if (container) {
       if (container.parentNode) {
diff --git a/packages/components/tests/spec/modal_spec.js b/packages/components/tests/spec/modal_spec.js
index 7f9ab9e5d3f3..b48ad4cfe10b 100644
--- a/packages/components/tests/spec/modal_spec.js
+++ b/packages/components/tests/spec/modal_spec.js
@@ -3,11 +3,11 @@ import ModalHtml from '../../html/modal/modal.html';
 import EventManager from '../utils/event-manager';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test modal', function() {
-  describe('Constructor', function() {
+describe('Test modal', function () {
+  describe('Constructor', function () {
     let modal;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         modal = new Modal();
       }).toThrowError(
@@ -16,7 +16,7 @@ describe('Test modal', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         modal = new Modal(document.createTextNode(''));
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('Test modal', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       const container = document.createElement('div');
       container.innerHTML = ModalHtml;
       const modalElement = container.querySelector('[data-modal]');
@@ -52,20 +52,20 @@ describe('Test modal', function() {
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (modal) {
         modal = modal.release();
       }
     });
   });
 
-  describe('Showing/hiding functions', function() {
+  describe('Showing/hiding functions', function () {
     let container;
     let modal;
     let element;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = ModalHtml;
       // Reset primary focus element for testing
@@ -76,11 +76,11 @@ describe('Test modal', function() {
       element = container.querySelector('[data-modal]');
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       modal = new Modal(element);
     });
 
-    it("Should sanity check show()'s arguments", function() {
+    it("Should sanity check show()'s arguments", function () {
       expect(() => {
         modal.show({});
       }).toThrowError(
@@ -89,7 +89,7 @@ describe('Test modal', function() {
       );
     });
 
-    it('Should have show() do nothing if already visible', function() {
+    it('Should have show() do nothing if already visible', function () {
       element.classList.add('is-visible');
       const spy = jasmine.createSpy();
       events.on(element, 'modal-beingshown', spy);
@@ -98,7 +98,7 @@ describe('Test modal', function() {
       expect(spy).not.toHaveBeenCalled();
     });
 
-    it('Should have show() method show modal', function() {
+    it('Should have show() method show modal', function () {
       const spy = jasmine.createSpy();
       events.on(modal.element, 'modal-shown', spy);
       modal.show();
@@ -109,7 +109,7 @@ describe('Test modal', function() {
       expect(element.classList.contains('is-visible')).toBe(true);
     });
 
-    it('Should have show() method support providing a DOM element instead of an event', function() {
+    it('Should have show() method support providing a DOM element instead of an event', function () {
       const spy = jasmine.createSpy();
       events.on(modal.element, 'modal-shown', spy);
       modal.show(modal.element);
@@ -122,7 +122,7 @@ describe('Test modal', function() {
       ).toBe(modal.element);
     });
 
-    it('Should call callback of show() method after it finishes', function() {
+    it('Should call callback of show() method after it finishes', function () {
       const spy = jasmine.createSpy();
       modal.show(spy);
       modal.element.dispatchEvent(
@@ -131,7 +131,7 @@ describe('Test modal', function() {
       expect(spy).toHaveBeenCalledTimes(1);
     });
 
-    it('Should focus on a child of modal upon showing', function() {
+    it('Should focus on a child of modal upon showing', function () {
       const firstTabbable = modal.element.querySelector('button');
       spyOn(firstTabbable, 'focus');
       modal.show();
@@ -141,7 +141,7 @@ describe('Test modal', function() {
       expect(firstTabbable.focus).toHaveBeenCalledTimes(1);
     });
 
-    it('Should support specifying the primary focus element', function() {
+    it('Should support specifying the primary focus element', function () {
       const primaryButton = modal.element.querySelector('.bx--btn--primary');
       spyOn(primaryButton, 'focus');
       primaryButton.dataset.modalPrimaryFocus = '';
@@ -156,7 +156,7 @@ describe('Test modal', function() {
       }
     });
 
-    it("Should sanity check hide()'s arguments", function() {
+    it("Should sanity check hide()'s arguments", function () {
       expect(() => {
         modal.hide({});
       }).toThrowError(
@@ -165,7 +165,7 @@ describe('Test modal', function() {
       );
     });
 
-    it('Should have hide() not hide if not visible', function() {
+    it('Should have hide() not hide if not visible', function () {
       const spy = jasmine.createSpy();
       events.on(element, 'modal-beinghidden', spy);
       modal.hide();
@@ -176,7 +176,7 @@ describe('Test modal', function() {
       expect(spy).not.toHaveBeenCalled();
     });
 
-    it('Should have hide() method hide modal', function() {
+    it('Should have hide() method hide modal', function () {
       modal.show();
       modal.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -188,7 +188,7 @@ describe('Test modal', function() {
       expect(spy).toHaveBeenCalled();
     });
 
-    it('Should have hide() method support providing a DOM element instead of an event', function() {
+    it('Should have hide() method support providing a DOM element instead of an event', function () {
       modal.show();
       modal.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -205,7 +205,7 @@ describe('Test modal', function() {
       ).toBe(modal.element);
     });
 
-    it('Should call callback of hide() method after it finishes', function() {
+    it('Should call callback of hide() method after it finishes', function () {
       modal.show();
       modal.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -218,35 +218,35 @@ describe('Test modal', function() {
       expect(spy).toHaveBeenCalledTimes(1);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       modal.release();
       events.reset();
       element.classList.remove('is-visible');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
     });
   });
 
-  describe('The various close actions', function() {
+  describe('The various close actions', function () {
     let container;
     let modal;
     let element;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = ModalHtml;
       document.body.appendChild(container);
       element = container.querySelector('[data-modal]');
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       modal = new Modal(element);
     });
 
-    it('Should handle the ESC key to close the modal', function() {
+    it('Should handle the ESC key to close the modal', function () {
       element.classList.add('is-visible');
       const spyBeforeHidden = jasmine.createSpy();
       const spyAfterHidden = jasmine.createSpy();
@@ -283,7 +283,7 @@ describe('Test modal', function() {
       ).toBe(element.ownerDocument.body);
     });
 
-    it('Should handle any elements with data-modal-close attribute to close the modal', function() {
+    it('Should handle any elements with data-modal-close attribute to close the modal', function () {
       modal.show();
       modal.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -322,7 +322,7 @@ describe('Test modal', function() {
       ).toBe(closeButton);
     });
 
-    it('Should handle any click outside the modal element to close the modal', function() {
+    it('Should handle any click outside the modal element to close the modal', function () {
       modal.show();
       modal.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -359,18 +359,18 @@ describe('Test modal', function() {
       ).toBe(element);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       modal.release();
       events.reset();
       element.classList.remove('is-visible');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
     });
   });
 
-  describe('Wrapping focus while modal is open', function() {
+  describe('Wrapping focus while modal is open', function () {
     let container;
     let modal;
     let element;
@@ -380,7 +380,7 @@ describe('Test modal', function() {
       return;
     }
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = ModalHtml;
       // Reset primary focus eleemnt for testing
@@ -395,7 +395,7 @@ describe('Test modal', function() {
       modal = new Modal(element);
     });
 
-    it('Should bring back focus when modal loses focus', async function() {
+    it('Should bring back focus when modal loses focus', async function () {
       modal.show();
       modal.element.dispatchEvent(
         new CustomEvent('transitionend', { bubbles: true })
@@ -404,7 +404,7 @@ describe('Test modal', function() {
       expect(element.contains(document.activeElement)).toBe(true);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (modal) {
         modal = modal.release();
       }
@@ -417,7 +417,7 @@ describe('Test modal', function() {
     });
   });
 
-  describe('Init Component by Launch functionality', function() {
+  describe('Init Component by Launch functionality', function () {
     let container;
     let modal;
     let element;
@@ -425,7 +425,7 @@ describe('Test modal', function() {
     let button;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = ModalHtml;
       document.body.appendChild(container);
@@ -433,23 +433,23 @@ describe('Test modal', function() {
       context = Modal.init();
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       modal = new Modal(element);
       button = document.querySelector('[data-modal-target]');
     });
 
-    it('Should launch the modal on button click', function() {
+    it('Should launch the modal on button click', function () {
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('is-visible')).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       modal.release();
       events.reset();
       element.classList.remove('is-visible');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
     });
   });
diff --git a/packages/components/tests/spec/navigation-menu-panel_spec.js b/packages/components/tests/spec/navigation-menu-panel_spec.js
index d529960cf52f..dd82d89ca33f 100644
--- a/packages/components/tests/spec/navigation-menu-panel_spec.js
+++ b/packages/components/tests/spec/navigation-menu-panel_spec.js
@@ -1,11 +1,11 @@
 import NavigationMenuPanel from '../../src/components/ui-shell/navigation-menu-panel';
 import UiShellHtml from '../../html/ui-shell/ui-shell.html';
 
-describe('Popup Nav', function() {
-  describe('Constructor', function() {
+describe('Popup Nav', function () {
+  describe('Constructor', function () {
     let navigationMenuPanel;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         navigationMenuPanel = new NavigationMenuPanel();
       }).toThrowError(
@@ -14,7 +14,7 @@ describe('Popup Nav', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         navigationMenuPanel = new NavigationMenuPanel(
           document.createTextNode('')
@@ -25,20 +25,20 @@ describe('Popup Nav', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (navigationMenuPanel) {
         navigationMenuPanel = navigationMenuPanel.release();
       }
     });
   });
 
-  describe('Init Component by Launch functionality', function() {
+  describe('Init Component by Launch functionality', function () {
     let button;
     let navigationMenu;
     let context;
     let options;
 
-    beforeAll(function() {
+    beforeAll(function () {
       const range = document.createRange();
       button = range
         .createContextualFragment(UiShellHtml)
@@ -64,12 +64,12 @@ describe('Popup Nav', function() {
       context = NavigationMenuPanel.init(undefined, options);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       button.classList.remove('bx--header__action--active');
       navigationMenu.setAttribute('hidden', '');
     });
 
-    it('Should open the popup nav on button click', function() {
+    it('Should open the popup nav on button click', function () {
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(button.classList.contains('bx--header__action--active')).toBe(
         true
@@ -77,7 +77,7 @@ describe('Popup Nav', function() {
       expect(navigationMenu.hasAttribute('hidden')).toBe(false);
     });
 
-    it('Should close an open popup nav on button click', function() {
+    it('Should close an open popup nav on button click', function () {
       navigationMenu.removeAttribute('hidden');
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(button.classList.contains('bx--header__action--active')).toBe(
@@ -86,7 +86,7 @@ describe('Popup Nav', function() {
       expect(navigationMenu.hasAttribute('hidden')).toBe(true);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(button);
       document.body.removeChild(navigationMenu);
       context.release();
diff --git a/packages/components/tests/spec/navigation-menu_spec.js b/packages/components/tests/spec/navigation-menu_spec.js
index a56103977f80..7fb5d2df436e 100644
--- a/packages/components/tests/spec/navigation-menu_spec.js
+++ b/packages/components/tests/spec/navigation-menu_spec.js
@@ -1,11 +1,11 @@
 import NavigationMenu from '../../src/components/ui-shell/navigation-menu';
 import UiShellHtml from '../../html/ui-shell/ui-shell.html';
 
-describe('Popup Nav', function() {
-  describe('Constructor', function() {
+describe('Popup Nav', function () {
+  describe('Constructor', function () {
     let navigationMenu;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         navigationMenu = new NavigationMenu();
       }).toThrowError(
@@ -14,7 +14,7 @@ describe('Popup Nav', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         navigationMenu = new NavigationMenu(document.createTextNode(''));
       }).toThrowError(
@@ -23,20 +23,20 @@ describe('Popup Nav', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (navigationMenu) {
         navigationMenu = navigationMenu.release();
       }
     });
   });
 
-  describe('Init Component by Launch functionality', function() {
+  describe('Init Component by Launch functionality', function () {
     let range;
     let button;
     let navigationMenu;
     let context;
 
-    beforeAll(function() {
+    beforeAll(function () {
       range = document.createRange();
       button = range
         .createContextualFragment(UiShellHtml)
@@ -49,12 +49,12 @@ describe('Popup Nav', function() {
       context = NavigationMenu.init();
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       button.classList.remove('bx--header__action--active');
       navigationMenu.setAttribute('hidden', '');
     });
 
-    it('Should open the popup nav on button click', function() {
+    it('Should open the popup nav on button click', function () {
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(button.classList.contains('bx--header__action--active')).toBe(
         true
@@ -62,7 +62,7 @@ describe('Popup Nav', function() {
       expect(navigationMenu.hasAttribute('hidden')).toBe(false);
     });
 
-    it('Should close an open popup nav on button click', function() {
+    it('Should close an open popup nav on button click', function () {
       navigationMenu.removeAttribute('hidden');
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(button.classList.contains('bx--header__action--active')).toBe(
@@ -71,14 +71,14 @@ describe('Popup Nav', function() {
       expect(navigationMenu.hasAttribute('hidden')).toBe(true);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(button);
       document.body.removeChild(navigationMenu);
       context.release();
     });
   });
 
-  describe('Keydown handler', function() {
+  describe('Keydown handler', function () {
     let range;
     let navigationMenuNode;
     let navigationMenuClass;
@@ -86,7 +86,7 @@ describe('Popup Nav', function() {
     let context;
     let escKeydown;
 
-    beforeAll(function() {
+    beforeAll(function () {
       range = document.createRange();
       navigationMenuNode = range
         .createContextualFragment(UiShellHtml)
@@ -95,7 +95,7 @@ describe('Popup Nav', function() {
         '.bx--navigation__category-toggle'
       );
       [...navigationMenuNode.querySelectorAll('.bx--navigation-link')].forEach(
-        link => {
+        (link) => {
           link.textContent = 'link';
         }
       );
@@ -106,19 +106,19 @@ describe('Popup Nav', function() {
       document.body.append(navigationMenuNode);
     });
 
-    it('should close navigation menu on Esc', function() {
+    it('should close navigation menu on Esc', function () {
       navigationMenuNode.removeAttribute('hidden');
       navigationMenuNode.dispatchEvent(escKeydown);
       expect(navigationMenuNode.hasAttribute('hidden'));
     });
 
-    describe('Up arrow navigation', function() {
+    describe('Up arrow navigation', function () {
       let navItems;
       let firstNavItem;
       let secondNavItem;
       let lastNavItem;
       let upArrowKeydown;
-      beforeAll(function() {
+      beforeAll(function () {
         navItems = navigationMenuNode.querySelectorAll(`
         .bx--navigation__category-toggle,
         .bx--navigation-item > .bx--navigation-link,
@@ -133,11 +133,11 @@ describe('Popup Nav', function() {
         });
       });
 
-      beforeEach(function() {
+      beforeEach(function () {
         navigationMenuNode.removeAttribute('hidden');
       });
 
-      it('should navigate backwards on up arrow', async function() {
+      it('should navigate backwards on up arrow', async function () {
         spyOn(firstNavItem, 'focus');
         secondNavItem.focus();
         secondNavItem.dispatchEvent(upArrowKeydown);
@@ -145,7 +145,7 @@ describe('Popup Nav', function() {
         expect(firstNavItem.focus).toHaveBeenCalledTimes(1);
       });
 
-      it('should wrap navigation from first to last item', function() {
+      it('should wrap navigation from first to last item', function () {
         spyOn(lastNavItem, 'focus');
         firstNavItem.focus();
         firstNavItem.dispatchEvent(upArrowKeydown);
@@ -153,7 +153,7 @@ describe('Popup Nav', function() {
         expect(lastNavItem.focus).toHaveBeenCalledTimes(1);
       });
 
-      it('should navigate out of submenus', function() {
+      it('should navigate out of submenus', function () {
         spyOn(button, 'focus');
         button.setAttribute('aria-expanded', 'true');
         firstNavItem.focus();
@@ -162,12 +162,12 @@ describe('Popup Nav', function() {
         expect(button.focus).toHaveBeenCalledTimes(1);
       });
 
-      afterEach(function() {
+      afterEach(function () {
         navigationMenuNode.setAttribute('hidden', '');
       });
     });
 
-    describe('Down arrow navigation', function() {
+    describe('Down arrow navigation', function () {
       let navItems;
       let firstNavItem;
       let secondNavItem;
@@ -175,7 +175,7 @@ describe('Popup Nav', function() {
       let downArrowKeydown;
       let firstNestedMenuItem;
 
-      beforeAll(function() {
+      beforeAll(function () {
         navItems = navigationMenuNode.querySelectorAll(`
         .bx--navigation__category-toggle,
         .bx--navigation-item > .bx--navigation-link,
@@ -193,11 +193,11 @@ describe('Popup Nav', function() {
         });
       });
 
-      beforeEach(function() {
+      beforeEach(function () {
         navigationMenuNode.removeAttribute('hidden');
       });
 
-      it('should navigate forwards on down arrow', async function() {
+      it('should navigate forwards on down arrow', async function () {
         spyOn(secondNavItem, 'focus');
         firstNavItem.focus();
         firstNavItem.dispatchEvent(downArrowKeydown);
@@ -205,7 +205,7 @@ describe('Popup Nav', function() {
         expect(secondNavItem.focus).toHaveBeenCalledTimes(1);
       });
 
-      it('should wrap navigation from last to first item', function() {
+      it('should wrap navigation from last to first item', function () {
         spyOn(firstNavItem, 'focus');
         lastNavItem.focus();
         lastNavItem.dispatchEvent(downArrowKeydown);
@@ -214,7 +214,7 @@ describe('Popup Nav', function() {
       });
 
       // eslint-disable-next-line no-undef
-      xit('should navigate into submenu', function() {
+      xit('should navigate into submenu', function () {
         // TODO: We may have removed "down arrow to open" feature, go ahead and remove this test if so
         navigationMenuClass.changeNavSubmenuState({
           matchesNavSubmenu: button,
@@ -225,12 +225,12 @@ describe('Popup Nav', function() {
         expect(firstNestedMenuItem.focus).toHaveBeenCalled();
       });
 
-      afterEach(function() {
+      afterEach(function () {
         navigationMenuNode.setAttribute('hidden', '');
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       button.setAttribute('aria-expanded', 'false');
       navigationMenuClass.release();
       if (context) {
@@ -240,7 +240,7 @@ describe('Popup Nav', function() {
     });
   });
 
-  describe('Click handler', function() {
+  describe('Click handler', function () {
     let range;
     let element;
     let navigationMenu;
@@ -249,7 +249,7 @@ describe('Popup Nav', function() {
     let button;
     let anchors;
 
-    beforeAll(function() {
+    beforeAll(function () {
       range = document.createRange();
       element = range
         .createContextualFragment(UiShellHtml)
@@ -261,8 +261,8 @@ describe('Popup Nav', function() {
       anchors = element.querySelectorAll('.bx--navigation-link');
     });
 
-    describe('Submenu', function() {
-      it('should open submenu', function() {
+    describe('Submenu', function () {
+      it('should open submenu', function () {
         button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(
           wrapper.classList.contains('bx--navigation__category--expanded')
@@ -270,7 +270,7 @@ describe('Popup Nav', function() {
         expect(button.getAttribute('aria-expanded')).toBe('true');
       });
 
-      it('should close an open submenu', function() {
+      it('should close an open submenu', function () {
         wrapper.classList.add('bx--navigation__category--expanded');
         button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(
@@ -279,14 +279,14 @@ describe('Popup Nav', function() {
       });
     });
 
-    describe('Link', function() {
-      it('should attach active link CSS classes on click', function() {
+    describe('Link', function () {
+      it('should attach active link CSS classes on click', function () {
         anchors[0].dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(li.classList.contains('bx--navigation-item--active')).toBe(true);
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       navigationMenu.release();
     });
   });
diff --git a/packages/components/tests/spec/notification_spec.js b/packages/components/tests/spec/notification_spec.js
index 21eae32101bc..ef6a8ccc2d08 100644
--- a/packages/components/tests/spec/notification_spec.js
+++ b/packages/components/tests/spec/notification_spec.js
@@ -3,18 +3,18 @@ import Notification from '../../src/components/notification/notification';
 import HTML from '../../html/notification/toast-notification.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('ToastNotification', function() {
-  describe('Constructor', function() {
+describe('ToastNotification', function () {
+  describe('Constructor', function () {
     let toastElement;
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(wrapper);
       toastElement = document.querySelector('.bx--toast-notification--error');
     });
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Notification();
       }).toThrowError(
@@ -23,7 +23,7 @@ describe('ToastNotification', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Notification(document.createTextNode(''));
       }).toThrowError(
@@ -32,7 +32,7 @@ describe('ToastNotification', function() {
       );
     });
 
-    it('should set default options', function() {
+    it('should set default options', function () {
       const instance = new Notification(toastElement);
       expect(flattenOptions(instance.options)).toEqual({
         selectorInit: '[data-notification]',
@@ -42,7 +42,7 @@ describe('ToastNotification', function() {
       });
     });
 
-    it('should search for an element with options.selectorInit', function() {
+    it('should search for an element with options.selectorInit', function () {
       toastElement.dataset.id = 'foo';
       const toastInstance = new Notification(toastElement, {
         selectorInit: '[data-id="foo"]',
@@ -51,7 +51,7 @@ describe('ToastNotification', function() {
       toastInstance.release();
     });
 
-    it('should search for close-button element with options.selectorButton', function() {
+    it('should search for close-button element with options.selectorButton', function () {
       const toastInstance = new Notification(toastElement);
       const toastButton = toastElement.querySelector(
         toastInstance.options.selectorButton
@@ -60,18 +60,18 @@ describe('ToastNotification', function() {
       toastInstance.release();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('Remove notification', function() {
+  describe('Remove notification', function () {
     let element;
     let instance;
     let events;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       events = new EventManager();
@@ -80,7 +80,7 @@ describe('ToastNotification', function() {
       instance = new Notification(element);
     });
 
-    it('should call remove method', function() {
+    it('should call remove method', function () {
       spyOn(instance, 'remove');
       instance.button.dispatchEvent(
         new CustomEvent('click', { bubbles: true })
@@ -88,7 +88,7 @@ describe('ToastNotification', function() {
       expect(instance.remove).toHaveBeenCalled();
     });
 
-    it('should remove notification on click event', function() {
+    it('should remove notification on click event', function () {
       instance.button.dispatchEvent(
         new CustomEvent('click', { bubbles: true })
       );
@@ -97,7 +97,7 @@ describe('ToastNotification', function() {
       );
     });
 
-    it('should emit notification-before-delete event on click', function() {
+    it('should emit notification-before-delete event on click', function () {
       const spyNotificationCloseEvent = jasmine.createSpy();
       events.on(
         element,
@@ -111,7 +111,7 @@ describe('ToastNotification', function() {
       expect(spyNotificationCloseEvent).toHaveBeenCalled();
     });
 
-    it('should emit notification-after-delete event on click', function() {
+    it('should emit notification-after-delete event on click', function () {
       const spyNotificationCloseEvent = jasmine.createSpy();
       events.on(
         element,
@@ -125,12 +125,12 @@ describe('ToastNotification', function() {
       expect(spyNotificationCloseEvent).toHaveBeenCalled();
     });
 
-    it('should delete instance from WeakMap with release', function() {
+    it('should delete instance from WeakMap with release', function () {
       instance.release();
       expect(Notification.components.get(element)).toBe(undefined);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
diff --git a/packages/components/tests/spec/number-input_spec.js b/packages/components/tests/spec/number-input_spec.js
index a7d233bf10c2..e2d2d43d2b0e 100644
--- a/packages/components/tests/spec/number-input_spec.js
+++ b/packages/components/tests/spec/number-input_spec.js
@@ -4,13 +4,13 @@ import NumberInput from '../../src/components/number-input/number-input';
 import HTML from '../../html/number-input/number-input.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test Number Input', function() {
-  describe('Constructor', function() {
+describe('Test Number Input', function () {
+  describe('Constructor', function () {
     let element;
     let instance;
     let container;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -18,7 +18,7 @@ describe('Test Number Input', function() {
       instance = new NumberInput(element);
     });
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new NumberInput();
       }).toThrowError(
@@ -27,7 +27,7 @@ describe('Test Number Input', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new NumberInput(document.createTextNode(''));
       }).toThrowError(
@@ -36,25 +36,25 @@ describe('Test Number Input', function() {
       );
     });
 
-    it('should set default options', function() {
+    it('should set default options', function () {
       expect(flattenOptions(instance.options)).toEqual({
         selectorInit: '[data-numberinput]',
         selectorInput: '.bx--number input',
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       instance.release();
     });
   });
 
-  describe('_handleClick', function() {
+  describe('_handleClick', function () {
     let element;
     let instance;
     let container;
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -62,7 +62,7 @@ describe('Test Number Input', function() {
       instance = new NumberInput(element);
     });
 
-    it('Should be called on click', function() {
+    it('Should be called on click', function () {
       spyOn(instance, '_handleClick');
       const event = new CustomEvent('click', { bubbles: true });
       const clickTarget = element.querySelector('.up-icon');
@@ -70,7 +70,7 @@ describe('Test Number Input', function() {
       expect(instance._handleClick).toHaveBeenCalled();
     });
 
-    it('Should emit a change event', function() {
+    it('Should emit a change event', function () {
       const spyOnChange = jasmine.createSpy();
       document.body.addEventListener('change', spyOnChange);
       const event = new CustomEvent('click', { bubbles: true });
@@ -79,20 +79,20 @@ describe('Test Number Input', function() {
       expect(spyOnChange).toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       document.body.removeChild(container);
       instance.release();
     });
   });
 
-  describe('Adding and Subtracting', function() {
+  describe('Adding and Subtracting', function () {
     let element;
     let instance;
     let inputNode;
     let container;
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -101,15 +101,15 @@ describe('Test Number Input', function() {
       inputNode = document.querySelector('input');
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       inputNode.value = '0';
       inputNode.max = '100';
       inputNode.min = '0';
     });
 
-    it('Should increase the value', async function() {
+    it('Should increase the value', async function () {
       const upArrowNode = document.querySelector('.up-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         upArrowNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       });
@@ -118,11 +118,11 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('1');
     });
 
-    it('Should increase the value when no maximum is set', async function() {
+    it('Should increase the value when no maximum is set', async function () {
       const upArrowNode = document.querySelector('.up-icon');
       inputNode.max = '';
       inputNode.min = '';
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         upArrowNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       });
@@ -131,10 +131,10 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('1');
     });
 
-    it('Should increase the value by the step amount', async function() {
+    it('Should increase the value by the step amount', async function () {
       inputNode.step = 5;
       const upArrowNode = document.querySelector('.up-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         upArrowNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       });
@@ -143,11 +143,11 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('5');
     });
 
-    it('Should not increase the value past the max', async function() {
+    it('Should not increase the value past the max', async function () {
       inputNode.step = 5;
       inputNode.max = 3;
       const upArrowNode = document.querySelector('.up-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         upArrowNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       });
@@ -156,12 +156,12 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('3');
     });
 
-    it('Should ignore increment when current value is above maximum', async function() {
+    it('Should ignore increment when current value is above maximum', async function () {
       inputNode.value = 1000;
       inputNode.step = 10;
       inputNode.max = 100;
       const upArrowNode = document.querySelector('.up-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         upArrowNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       });
@@ -170,11 +170,11 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('1000');
     });
 
-    it('Should set value to maximum on decrement when current value is above maximum', async function() {
+    it('Should set value to maximum on decrement when current value is above maximum', async function () {
       inputNode.value = inputNode.max + 1;
       inputNode.step = 10;
       const downArrowNode = document.querySelector('.down-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         downArrowNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -185,12 +185,12 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe(inputNode.max);
     });
 
-    it('Should ignore decrement when current value is below minimum', async function() {
+    it('Should ignore decrement when current value is below minimum', async function () {
       inputNode.value = -100;
       inputNode.step = 10;
       inputNode.min = 0;
       const downArrowNode = document.querySelector('.down-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         downArrowNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -201,11 +201,11 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('-100');
     });
 
-    it('Should set value to minimum on increment when current value is below minimum', async function() {
+    it('Should set value to minimum on increment when current value is below minimum', async function () {
       inputNode.value = inputNode.min - 100;
       inputNode.step = 10;
       const upArrowNode = document.querySelector('.up-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         upArrowNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       });
@@ -214,10 +214,10 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe(inputNode.min);
     });
 
-    it('Should decrease the value', async function() {
+    it('Should decrease the value', async function () {
       const downArrowNode = document.querySelector('.down-icon');
       inputNode.value = '1';
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         downArrowNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -228,13 +228,13 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('0');
     });
 
-    it('Should decrease the value when no minimum is set', async function() {
+    it('Should decrease the value when no minimum is set', async function () {
       const downArrowNode = document.querySelector('.down-icon');
       inputNode.min = '';
       inputNode.max = '';
       inputNode.step = 1;
       inputNode.value = '1';
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         downArrowNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -245,11 +245,11 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('0');
     });
 
-    it('Should decrease the value by the step amount', async function() {
+    it('Should decrease the value by the step amount', async function () {
       inputNode.value = 5;
       inputNode.step = 5;
       const downArrowNode = document.querySelector('.down-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         downArrowNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -260,11 +260,11 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('0');
     });
 
-    it('Should not decrease the value past the min', async function() {
+    it('Should not decrease the value past the min', async function () {
       inputNode.value = 3;
       inputNode.step = 5;
       const downArrowNode = document.querySelector('.down-icon');
-      const e = await new Promise(resolve => {
+      const e = await new Promise((resolve) => {
         events.on(document.body, 'change', resolve);
         downArrowNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -275,28 +275,28 @@ describe('Test Number Input', function() {
       expect(inputNode.value).toBe('0');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
       instance.release();
     });
   });
 
-  describe('Managing instances', function() {
+  describe('Managing instances', function () {
     let element;
     let container;
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
       element = document.querySelector('[data-numberinput]');
     });
 
-    it('Should prevent creating duplicate instances', function() {
+    it('Should prevent creating duplicate instances', function () {
       let first;
       let second;
       try {
@@ -311,7 +311,7 @@ describe('Test Number Input', function() {
       }
     });
 
-    it('Should let create a new instance for an element if an earlier one has been released', function() {
+    it('Should let create a new instance for an element if an earlier one has been released', function () {
       let first;
       let second;
       try {
@@ -327,7 +327,7 @@ describe('Test Number Input', function() {
       }
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
     });
   });
diff --git a/packages/components/tests/spec/overflow-menu_spec.js b/packages/components/tests/spec/overflow-menu_spec.js
index b2e7000243c6..e40a9f26c622 100644
--- a/packages/components/tests/spec/overflow-menu_spec.js
+++ b/packages/components/tests/spec/overflow-menu_spec.js
@@ -2,9 +2,9 @@ import EventManager from '../utils/event-manager';
 import OverflowMenu from '../../src/components/overflow-menu/overflow-menu';
 import HTML from '../../html/overflow-menu/overflow-menu.html';
 
-describe('Test Overflow menu', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test Overflow menu', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new OverflowMenu();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Test Overflow menu', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new OverflowMenu(document.createTextNode(''));
       }).toThrowError(
@@ -23,19 +23,19 @@ describe('Test Overflow menu', function() {
     });
   });
 
-  describe('Toggling a single overflow-menu', function() {
+  describe('Toggling a single overflow-menu', function () {
     let menu;
     let element;
     const container = document.createElement('div');
     container.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       element = document.querySelector('[data-overflow-menu]');
       menu = new OverflowMenu(element);
     });
 
-    it('Should set and remove "bx--overflow-menu--open" class on the element on click event', function() {
+    it('Should set and remove "bx--overflow-menu--open" class on the element on click event', function () {
       // Initial click to open overflow-menu:
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('bx--overflow-menu--open')).toBe(true);
@@ -46,17 +46,17 @@ describe('Test Overflow menu', function() {
       expect(element.classList.contains('bx--overflow-menu--open')).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('bx--overflow-menu--open');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       menu.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Custom event emission', function() {
+  describe('Custom event emission', function () {
     let menu;
     let element;
     let optionsElement;
@@ -65,16 +65,16 @@ describe('Test Overflow menu', function() {
 
     const events = new EventManager();
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       element = document.querySelector('.bx--overflow-menu');
       optionsElement = element.querySelector('.bx--overflow-menu-options');
       menu = new OverflowMenu(element);
     });
 
-    it('Should provide a way to cancel showing overflow menu', function() {
+    it('Should provide a way to cancel showing overflow menu', function () {
       const spyOverflowEvent = jasmine.createSpy();
-      events.on(element.ownerDocument.body, 'floating-menu-beingshown', e => {
+      events.on(element.ownerDocument.body, 'floating-menu-beingshown', (e) => {
         e.preventDefault();
       });
       events.on(
@@ -93,7 +93,7 @@ describe('Test Overflow menu', function() {
       ).toBe(false);
     });
 
-    describe('Arrow key navigation', function() {
+    describe('Arrow key navigation', function () {
       const upArrowKeydown = new KeyboardEvent('keydown', { bubbles: true });
       Object.defineProperty(upArrowKeydown, 'which', {
         value: 38,
@@ -117,8 +117,8 @@ describe('Test Overflow menu', function() {
         items[0].focus();
       });
 
-      describe('Up/Down arrow keys', function() {
-        it('should move focus from currently focused item to previous menu item', function() {
+      describe('Up/Down arrow keys', function () {
+        it('should move focus from currently focused item to previous menu item', function () {
           spyOn(items[0], 'focus');
           items[1].focus();
           element.dispatchEvent(upArrowKeydown);
@@ -126,20 +126,20 @@ describe('Test Overflow menu', function() {
           expect(items[0].focus).toHaveBeenCalledTimes(1);
         });
 
-        it('should wrap focus from first menu item to last menu item', function() {
+        it('should wrap focus from first menu item to last menu item', function () {
           spyOn(items[items.length - 1], 'focus');
           element.dispatchEvent(upArrowKeydown);
           expect(items[items.length - 1].focus).toHaveBeenCalled();
           expect(items[items.length - 1].focus).toHaveBeenCalledTimes(1);
         });
 
-        it('should move focus from currently focused item to next menu item', function() {
+        it('should move focus from currently focused item to next menu item', function () {
           spyOn(items[1], 'focus');
           optionsElement.dispatchEvent(downArrowKeydown);
           expect(items[1].focus).toHaveBeenCalledTimes(1);
         });
 
-        it('should wrap focus from last menu item to first menu item', function() {
+        it('should wrap focus from last menu item to first menu item', function () {
           spyOn(items[0], 'focus');
           items[items.length - 1].focus();
           optionsElement.dispatchEvent(downArrowKeydown);
@@ -153,18 +153,22 @@ describe('Test Overflow menu', function() {
       });
     });
 
-    it('Should emit an event after showing', function() {
+    it('Should emit an event after showing', function () {
       const spyOverflowEvent = jasmine.createSpy();
       events.on(document, 'floating-menu-shown', spyOverflowEvent);
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(spyOverflowEvent).toHaveBeenCalled();
     });
 
-    it('Should provide a way to cancel hiding overflow menu', function() {
+    it('Should provide a way to cancel hiding overflow menu', function () {
       const spyOverflowEvent = jasmine.createSpy();
-      events.on(element.ownerDocument.body, 'floating-menu-beinghidden', e => {
-        e.preventDefault();
-      });
+      events.on(
+        element.ownerDocument.body,
+        'floating-menu-beinghidden',
+        (e) => {
+          e.preventDefault();
+        }
+      );
       events.on(
         element.ownerDocument.body,
         'floating-menu-hidden',
@@ -183,7 +187,7 @@ describe('Test Overflow menu', function() {
       ).toBe(true);
     });
 
-    it('Should emit an event after hiding', function() {
+    it('Should emit an event after hiding', function () {
       const spyOverflowEvent = jasmine.createSpy();
       events.on(document, 'floating-menu-hidden', spyOverflowEvent);
       element.classList.add('bx--overflow-menu--open');
@@ -193,19 +197,19 @@ describe('Test Overflow menu', function() {
       expect(spyOverflowEvent).toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       optionsElement.classList.remove('bx--overflow-menu-options--open');
       element.classList.remove('bx--overflow-menu--open');
       events.reset();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       menu.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Toggling multiple overflow-menus', function() {
+  describe('Toggling multiple overflow-menus', function () {
     let elements;
     let element1;
     let element2;
@@ -214,11 +218,11 @@ describe('Test Overflow menu', function() {
     const container = document.createElement('div');
     container.innerHTML = [HTML, HTML, HTML].join('');
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       elements = [...document.querySelectorAll('.bx--overflow-menu')];
       [element1, element2, element3] = elements;
-      optionElements = elements.map(element =>
+      optionElements = elements.map((element) =>
         element.querySelector('.bx--overflow-menu-options')
       );
       new OverflowMenu(element1);
@@ -226,7 +230,7 @@ describe('Test Overflow menu', function() {
       new OverflowMenu(element3);
     });
 
-    it('Should open one menu on a single click event', function() {
+    it('Should open one menu on a single click event', function () {
       element1.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         element1.classList.contains('bx--overflow-menu--open'),
@@ -242,7 +246,7 @@ describe('Test Overflow menu', function() {
       ).toBe(false);
     });
 
-    it('Should open one menu on multiple click events', function() {
+    it('Should open one menu on multiple click events', function () {
       element1.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       element2.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
@@ -259,28 +263,28 @@ describe('Test Overflow menu', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
-      optionElements.forEach(optionElement => {
+    afterEach(function () {
+      optionElements.forEach((optionElement) => {
         optionElement.classList.remove('bx--overflow-menu-options--open');
       });
-      elements.forEach(element => {
+      elements.forEach((element) => {
         element.classList.remove('bx--overflow-menu--open');
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(container);
     });
   });
 
-  describe('Managing focus', function() {
+  describe('Managing focus', function () {
     let menu;
     let element;
     let firstItemNode;
     const container = document.createElement('div');
     container.innerHTML = HTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       element = document.querySelector('.bx--overflow-menu');
       firstItemNode = element.querySelector(
@@ -289,24 +293,24 @@ describe('Test Overflow menu', function() {
       menu = new OverflowMenu(element);
     });
 
-    it('Should focus on the floating menu when the menu is open', function() {
+    it('Should focus on the floating menu when the menu is open', function () {
       spyOn(firstItemNode, 'focus');
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(firstItemNode.focus).toHaveBeenCalledTimes(1);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       menu.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Managing instances', function() {
+  describe('Managing instances', function () {
     let menu;
     let element;
     let container;
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = HTML;
       document.body.appendChild(container);
@@ -314,14 +318,14 @@ describe('Test Overflow menu', function() {
       menu = OverflowMenu.create(element);
     });
 
-    it('Should remove click event listener on document object once the instance is released', function() {
+    it('Should remove click event listener on document object once the instance is released', function () {
       element.classList.add('bx--overflow-menu--open');
       menu.release();
       document.body.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(element.classList.contains('bx--overflow-menu--open')).toBe(true);
     });
 
-    it('Should remove keypress event listener on document object once the instance is released', function() {
+    it('Should remove keypress event listener on document object once the instance is released', function () {
       element.classList.add('bx--overflow-menu--open');
       menu.release();
       const event = new CustomEvent('keypress', { bubbles: true });
@@ -330,7 +334,7 @@ describe('Test Overflow menu', function() {
       expect(element.classList.contains('bx--overflow-menu--open')).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       document.body.removeChild(container);
       menu.release();
     });
diff --git a/packages/components/tests/spec/pagination-nav_spec.js b/packages/components/tests/spec/pagination-nav_spec.js
index 64e639e8159c..adb84a6d6132 100644
--- a/packages/components/tests/spec/pagination-nav_spec.js
+++ b/packages/components/tests/spec/pagination-nav_spec.js
@@ -137,7 +137,7 @@ describe('Pagination Nav', () => {
       const pageButtonArray = element.querySelectorAll(
         instance.options.selectorPageElement
       );
-      pageButtonArray.forEach(el => {
+      pageButtonArray.forEach((el) => {
         el.dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(el.classList.contains(instance.options.classActive)).toBe(true);
         expect(el.classList.contains(instance.options.classDisabled)).toBe(
diff --git a/packages/components/tests/spec/pagination_spec.js b/packages/components/tests/spec/pagination_spec.js
index 55cdbf5ed337..bb62f86a1e67 100644
--- a/packages/components/tests/spec/pagination_spec.js
+++ b/packages/components/tests/spec/pagination_spec.js
@@ -1,11 +1,11 @@
 import Pagination from '../../src/components/pagination/pagination';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test pagination', function() {
-  describe('Constructor', function() {
+describe('Test pagination', function () {
+  describe('Constructor', function () {
     let pagination;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         pagination = new Pagination();
       }).toThrowError(
@@ -14,7 +14,7 @@ describe('Test pagination', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         pagination = new Pagination(document.createTextNode(''));
       }).toThrowError(
@@ -23,7 +23,7 @@ describe('Test pagination', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       expect(
         flattenOptions(
           (pagination = new Pagination(document.createElement('div'))).options
@@ -40,7 +40,7 @@ describe('Test pagination', function() {
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (pagination) {
         pagination = pagination.release();
       }
diff --git a/packages/components/tests/spec/product-switcher_spec.js b/packages/components/tests/spec/product-switcher_spec.js
index 266afaf5b50c..a380dd537f64 100644
--- a/packages/components/tests/spec/product-switcher_spec.js
+++ b/packages/components/tests/spec/product-switcher_spec.js
@@ -1,11 +1,11 @@
 import ProductSwitcher from '../../src/components/ui-shell/product-switcher';
 import UiShellHtml from '../../html/ui-shell/ui-shell.html';
 
-describe('Popup Nav', function() {
-  describe('Constructor', function() {
+describe('Popup Nav', function () {
+  describe('Constructor', function () {
     let productSwitcher;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         productSwitcher = new ProductSwitcher();
       }).toThrowError(
@@ -14,7 +14,7 @@ describe('Popup Nav', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         productSwitcher = new ProductSwitcher(document.createTextNode(''));
       }).toThrowError(
@@ -23,19 +23,19 @@ describe('Popup Nav', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (productSwitcher) {
         productSwitcher = productSwitcher.release();
       }
     });
   });
 
-  describe('Init Component by Launch functionality', function() {
+  describe('Init Component by Launch functionality', function () {
     let button;
     let productSwitcher;
     let context;
 
-    beforeAll(function() {
+    beforeAll(function () {
       const range = document.createRange();
       button = range
         .createContextualFragment(UiShellHtml)
@@ -48,12 +48,12 @@ describe('Popup Nav', function() {
       context = ProductSwitcher.init();
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       button.classList.remove('bx--header__action--active');
       productSwitcher.classList.remove('bx--panel--expanded');
     });
 
-    it('Should open the popup nav on button click', function() {
+    it('Should open the popup nav on button click', function () {
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(button.classList.contains('bx--header__action--active')).toBe(
         true
@@ -63,7 +63,7 @@ describe('Popup Nav', function() {
       );
     });
 
-    it('Should close an open popup nav on button click', function() {
+    it('Should close an open popup nav on button click', function () {
       productSwitcher.classList.add('bx--panel--expanded');
       button.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(button.classList.contains('bx--header__action--active')).toBe(
@@ -74,7 +74,7 @@ describe('Popup Nav', function() {
       );
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(button);
       document.body.removeChild(productSwitcher);
       context.release();
diff --git a/packages/components/tests/spec/progress-indicator_spec.js b/packages/components/tests/spec/progress-indicator_spec.js
index df6b54caf401..26cf9ba04f6b 100644
--- a/packages/components/tests/spec/progress-indicator_spec.js
+++ b/packages/components/tests/spec/progress-indicator_spec.js
@@ -3,20 +3,20 @@ import ProgressIndicator from '../../src/components/progress-indicator/progress-
 import HTML from '../../html/progress-indicator/progress-indicator.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('ProgressIndicator', function() {
-  describe('Constructor', function() {
+describe('ProgressIndicator', function () {
+  describe('Constructor', function () {
     let element;
     let instance;
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(wrapper);
       element = document.querySelector('[data-progress]');
       instance = new ProgressIndicator(element);
     });
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new ProgressIndicator();
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('ProgressIndicator', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new ProgressIndicator(document.createTextNode(''));
       }).toThrowError(
@@ -34,7 +34,7 @@ describe('ProgressIndicator', function() {
       );
     });
 
-    it('should set default options', function() {
+    it('should set default options', function () {
       expect(flattenOptions(instance.options)).toEqual({
         selectorInit: '[data-progress]',
         selectorStepElement: '.bx--progress-step',
@@ -55,33 +55,33 @@ describe('ProgressIndicator', function() {
       });
     });
 
-    it('state.currentIndex should be a number', function() {
+    it('state.currentIndex should be a number', function () {
       expect(isNaN(instance.state.currentIndex)).toBe(false);
     });
 
-    it('state.totalSteps should be a number', function() {
+    it('state.totalSteps should be a number', function () {
       expect(isNaN(instance.state.totalSteps)).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_updateStep', function() {
+  describe('_updateStep', function () {
     let element;
     let instance;
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(wrapper);
       element = document.querySelector('[data-progress]');
       instance = new ProgressIndicator(element);
     });
 
-    it('should remove the svg contained inside given element param', function() {
+    it('should remove the svg contained inside given element param', function () {
       const el = instance.element.querySelector(
         instance.options.selectorIncomplete
       );
@@ -92,7 +92,7 @@ describe('ProgressIndicator', function() {
       expect(el.firstElementChild.tagName).not.toBe('svg');
     });
 
-    it('should update className with given className param', function() {
+    it('should update className with given className param', function () {
       const el = instance.element.querySelector(
         instance.options.selectorIncomplete
       );
@@ -103,13 +103,13 @@ describe('ProgressIndicator', function() {
       expect(el.classList.contains(instance.options.classComplete)).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('addOverflowTooltip', function() {
+  describe('addOverflowTooltip', function () {
     let element;
     let instance;
     let stepLabel;
@@ -118,7 +118,7 @@ describe('ProgressIndicator', function() {
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(wrapper);
       element = document.querySelector('[data-progress]');
       stepLabel = element.querySelector('.bx--progress-label');
@@ -131,7 +131,7 @@ describe('ProgressIndicator', function() {
       element.appendChild(tooltipDiv);
     });
 
-    it('should not have overflow class', function() {
+    it('should not have overflow class', function () {
       stepLabel.textContent = 'Step';
       instance = new ProgressIndicator(element);
       expect(stepLabel.classList.contains('bx--progress-label-overflow')).toBe(
@@ -139,7 +139,7 @@ describe('ProgressIndicator', function() {
       );
     });
 
-    it('should have an overflow class', function() {
+    it('should have an overflow class', function () {
       stepLabel.textContent = 'Overflow Ex. 1';
       instance = new ProgressIndicator(element);
       expect(stepLabel.classList.contains('bx--progress-label-overflow')).toBe(
@@ -147,131 +147,131 @@ describe('ProgressIndicator', function() {
       );
     });
 
-    it('multi line tooltip should have multi line class', function() {
+    it('multi line tooltip should have multi line class', function () {
       stepLabel.textContent = 'Overflow Ex. 2 Multi Line';
       tooltipText.style.height = '24px';
       instance = new ProgressIndicator(element);
       expect(tooltipDiv.classList.contains('bx--tooltip_multi')).toBe(true);
     });
 
-    it('single line tooltip should not have multi line class', function() {
+    it('single line tooltip should not have multi line class', function () {
       stepLabel.textContent = 'Overflow Ex. 1';
       tooltipText.style.height = '20px';
       instance = new ProgressIndicator(element);
       expect(tooltipDiv.classList.contains('bx--tooltip_multi')).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('getSteps', function() {
+  describe('getSteps', function () {
     let element;
     let instance;
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(wrapper);
       element = document.querySelector('[data-progress]');
       instance = new ProgressIndicator(element);
     });
 
-    it('should loop through all step elements with the correct selector', function() {
+    it('should loop through all step elements with the correct selector', function () {
       const className = instance.options.classStep;
       const steps = instance.getSteps();
-      steps.forEach(step =>
+      steps.forEach((step) =>
         expect(step.element.classList.contains(className)).toBe(true)
       );
     });
 
-    it('should return an Array of objects with "element" and "index" keynames', function() {
+    it('should return an Array of objects with "element" and "index" keynames', function () {
       const elementKey = Object.keys(instance.getSteps()[0])[0];
       const indexKey = Object.keys(instance.getSteps()[0])[1];
       expect(elementKey).toBe('element');
       expect(indexKey).toBe('index');
     });
 
-    it('index should be a number', function() {
+    it('index should be a number', function () {
       expect(isNaN(instance.getSteps()[0].index)).toBe(false);
     });
 
-    it('order should start counting from 0', function() {
-      const firstStepIndex = instance.getSteps().map(step => step.index)[0];
+    it('order should start counting from 0', function () {
+      const firstStepIndex = instance.getSteps().map((step) => step.index)[0];
       expect(firstStepIndex).toBe(0);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('getCurrent', function() {
+  describe('getCurrent', function () {
     let element;
     let instance;
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(wrapper);
       element = document.querySelector('[data-progress]');
       instance = new ProgressIndicator(element);
     });
 
-    it('should return an object with element and index keys', function() {
+    it('should return an object with element and index keys', function () {
       expect(Object.keys(instance.getCurrent())[0]).toBe('element');
       expect(Object.keys(instance.getCurrent())[1]).toBe('index');
     });
 
-    it('element value should have correct className: classStep', function() {
+    it('element value should have correct className: classStep', function () {
       const el = instance.getCurrent().element;
       expect(el.classList.contains(instance.options.classStep)).toBe(true);
     });
 
-    it('element value should have correct className: classCurrent', function() {
+    it('element value should have correct className: classCurrent', function () {
       const el = instance.getCurrent().element;
       expect(el.classList.contains(instance.options.classCurrent)).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('setCurrent', function() {
+  describe('setCurrent', function () {
     let element;
     let instance;
     const wrapper = document.createElement('div');
     wrapper.innerHTML = HTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(wrapper);
       element = document.querySelector('[data-progress]');
       instance = new ProgressIndicator(element);
     });
 
-    it('should set a new currentIndex with a given number param', function() {
+    it('should set a new currentIndex with a given number param', function () {
       instance.setCurrent(2);
       expect(instance.state.currentIndex).toBe(2);
     });
 
-    it('should update className of new currentIndex', function() {
+    it('should update className of new currentIndex', function () {
       instance.setCurrent(2);
       const el = instance.getCurrent().element;
       expect(el.classList.contains(instance.options.classCurrent)).toBe(true);
     });
 
-    it('should set state of previous steps to complete', function() {
+    it('should set state of previous steps to complete', function () {
       instance.setCurrent(2);
 
       const previousStep = instance
         .getSteps()
-        .map(step => step)
-        .filter(step => step.index < 2)[0];
+        .map((step) => step)
+        .filter((step) => step.index < 2)[0];
 
       expect(
         previousStep.element.classList.contains(instance.options.classComplete)
@@ -281,13 +281,13 @@ describe('ProgressIndicator', function() {
       ).toBe(false);
     });
 
-    it('should set state of next steps to incomplete', function() {
+    it('should set state of next steps to incomplete', function () {
       instance.setCurrent(2);
 
       const nextStep = instance
         .getSteps()
-        .map(step => step)
-        .filter(step => step.index > 2)[0];
+        .map((step) => step)
+        .filter((step) => step.index > 2)[0];
 
       expect(
         nextStep.element.classList.contains(instance.options.classIncomplete)
@@ -300,7 +300,7 @@ describe('ProgressIndicator', function() {
       ).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
diff --git a/packages/components/tests/spec/search_spec.js b/packages/components/tests/spec/search_spec.js
index aef56fbfd807..a5d5a4dfb672 100644
--- a/packages/components/tests/spec/search_spec.js
+++ b/packages/components/tests/spec/search_spec.js
@@ -2,9 +2,9 @@ import Search from '../../src/components/search/search';
 import searchHTML from '../../html/search/search--extra-large.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test Search', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test Search', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Search();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Test Search', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Search(document.createTextNode(''));
       }).toThrowError(
@@ -22,7 +22,7 @@ describe('Test Search', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       const container = document.createElement('div');
       container.innerHTML = searchHTML;
       const search = new Search(container);
@@ -42,7 +42,7 @@ describe('Test Search', function() {
     });
   });
 
-  describe('Clearing the search bar', function() {
+  describe('Clearing the search bar', function () {
     let input;
     let clearIcon;
     let clearIconInitialState;
@@ -50,7 +50,7 @@ describe('Test Search', function() {
     const container = document.createElement('div');
     container.innerHTML = searchHTML;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       instance = new Search(document.querySelector('[data-search]'));
       input = container.querySelector('.bx--search-input');
@@ -64,11 +64,11 @@ describe('Test Search', function() {
           .indexOf('bx--search-close--hidden') >= 0;
     });
 
-    it('Clear icon should be hidden by default', function() {
+    it('Clear icon should be hidden by default', function () {
       expect(clearIconInitialState).toBe(true);
     });
 
-    it('Clear icon should be shown when input has value', function() {
+    it('Clear icon should be shown when input has value', function () {
       input.value = 'testing';
       input.dispatchEvent(new CustomEvent('input', { bubbles: true }));
       // IE11 doesn't have `.classList` for `<svg>`
@@ -81,12 +81,12 @@ describe('Test Search', function() {
       ).toBe(true);
     });
 
-    it('Should clear the input when clicked', function() {
+    it('Should clear the input when clicked', function () {
       clearIcon.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(input.value).toBe('');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(container);
     });
diff --git a/packages/components/tests/spec/side-nav_spec.js b/packages/components/tests/spec/side-nav_spec.js
index 3aaae41bc0cb..38e5b6a2ab3f 100644
--- a/packages/components/tests/spec/side-nav_spec.js
+++ b/packages/components/tests/spec/side-nav_spec.js
@@ -1,15 +1,15 @@
 import SideNav from '../../src/components/ui-shell/side-nav';
 
-describe('Side Nav', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Side Nav', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => new SideNav()).toThrowError(
         TypeError,
         'DOM element should be given to initialize this widget.'
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => new SideNav(document.createTextNode(''))).toThrowError(
         TypeError,
         'DOM element should be given to initialize this widget.'
@@ -17,7 +17,7 @@ describe('Side Nav', function() {
     });
   });
 
-  describe('Click handler', function() {
+  describe('Click handler', function () {
     let element;
     let toggleNode;
     let navLinkNode1;
@@ -28,7 +28,7 @@ describe('Side Nav', function() {
     let navSubmenuTriggerNode;
     let sideNav;
 
-    beforeAll(function() {
+    beforeAll(function () {
       element = document.createElement('aside');
       element.className = 'bx--side-nav';
       element.setAttribute('data-side-nav', 'true');
@@ -57,13 +57,13 @@ describe('Side Nav', function() {
       document.body.appendChild(element);
     });
 
-    describe('Click toggle', function() {
-      it('should open the side nav on toggle click', function() {
+    describe('Click toggle', function () {
+      it('should open the side nav on toggle click', function () {
         toggleNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(element.classList.contains('bx--side-nav--expanded')).toBe(true);
       });
 
-      it('should close the open side nav on toggle click', function() {
+      it('should close the open side nav on toggle click', function () {
         toggleNode.setAttribute('aria-expanded', 'true');
         toggleNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(element.classList.contains('bx--side-nav--expanded')).toBe(
@@ -72,8 +72,8 @@ describe('Side Nav', function() {
       });
     });
 
-    describe('Click side nav link', function() {
-      it('should attach CSS classes on click', function() {
+    describe('Click side nav link', function () {
+      it('should attach CSS classes on click', function () {
         navLinkTriggerNode1.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
         );
@@ -84,7 +84,7 @@ describe('Side Nav', function() {
           navLinkNode1.classList.contains('bx--side-nav__item--active')
         ).toBe(true);
       });
-      it('should detach CSS classes from previously active links when nav link is active', function() {
+      it('should detach CSS classes from previously active links when nav link is active', function () {
         navLinkTriggerNode1.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
         );
@@ -106,8 +106,8 @@ describe('Side Nav', function() {
       });
     });
 
-    describe('Click nav submenu', function() {
-      it('should open the submenu on click', function() {
+    describe('Click nav submenu', function () {
+      it('should open the submenu on click', function () {
         navSubmenuTriggerNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
         );
@@ -116,7 +116,7 @@ describe('Side Nav', function() {
         );
       });
 
-      it('should close the open submenu on click', function() {
+      it('should close the open submenu on click', function () {
         navSubmenuTriggerNode.setAttribute('aria-expanded', 'true');
         navSubmenuTriggerNode.dispatchEvent(
           new CustomEvent('click', { bubbles: true })
@@ -127,12 +127,12 @@ describe('Side Nav', function() {
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       toggleNode.setAttribute('aria-expanded', 'false');
       navSubmenuTriggerNode.setAttribute('aria-expanded', 'false');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       sideNav.release();
       document.body.removeChild(element);
     });
diff --git a/packages/components/tests/spec/slider_spec.js b/packages/components/tests/spec/slider_spec.js
index 6519d9ef0699..915bb1506917 100644
--- a/packages/components/tests/spec/slider_spec.js
+++ b/packages/components/tests/spec/slider_spec.js
@@ -3,11 +3,11 @@ import Slider from '../../src/components/slider/slider';
 import SliderHTML from '../../html/slider/slider.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test slider', function() {
-  describe('Constructor', function() {
+describe('Test slider', function () {
+  describe('Constructor', function () {
     let slider;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         slider = new Slider();
       }).toThrowError(
@@ -16,7 +16,7 @@ describe('Test slider', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         slider = new Slider(document.createTextNode(''));
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('Test slider', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       const container = document.createElement('div');
       container.innerHTML = SliderHTML;
       document.body.appendChild(container);
@@ -45,48 +45,48 @@ describe('Test slider', function() {
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (slider) {
         slider = slider.release();
       }
     });
   });
-  describe('Programatic change', function() {
+  describe('Programatic change', function () {
     let slider;
     let container;
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = SliderHTML;
       document.body.appendChild(container);
       slider = new Slider(document.querySelector('[data-slider]'));
     });
-    it('Should setValue as expected', function() {
+    it('Should setValue as expected', function () {
       slider.setValue(100);
       expect(slider.getInputProps().value).toBe(100);
     });
-    it('Should stepUp as expected', function() {
+    it('Should stepUp as expected', function () {
       slider.setValue(50);
       slider.stepUp();
       expect(slider.getInputProps().value).toBe(51);
     });
-    it('Should stepDown as expected', function() {
+    it('Should stepDown as expected', function () {
       slider.setValue(50);
       slider.stepDown();
       expect(slider.getInputProps().value).toBe(49);
     });
-    afterEach(function() {
+    afterEach(function () {
       if (slider) {
         slider = slider.release();
         document.body.innerHTML = '';
       }
     });
   });
-  describe('Keydown on slider', function() {
+  describe('Keydown on slider', function () {
     let container;
     let slider;
     let thumb;
     let mockRaf;
-    beforeEach(function() {
+    beforeEach(function () {
       mockRaf = createMockRaf();
       spyOn(window, 'requestAnimationFrame').and.callFake(mockRaf.raf);
       container = document.createElement('div');
@@ -97,7 +97,7 @@ describe('Test slider', function() {
       mockRaf.step({ count: 1 });
       slider.setValue(50);
     });
-    it('Should stepUp value on up/right key', function() {
+    it('Should stepUp value on up/right key', function () {
       const event = new CustomEvent('keydown', { bubbles: true });
       event.which = 39;
       thumb.dispatchEvent(event);
@@ -110,7 +110,7 @@ describe('Test slider', function() {
       mockRaf.step({ count: 1 });
       expect(slider.getInputProps().value).toBe(52);
     });
-    it('Should stepDown value on down/left key', function() {
+    it('Should stepDown value on down/left key', function () {
       const event = new CustomEvent('keydown', { bubbles: true });
       event.which = 40;
       thumb.dispatchEvent(event);
@@ -123,19 +123,19 @@ describe('Test slider', function() {
       mockRaf.step({ count: 1 });
       expect(slider.getInputProps().value).toBe(48);
     });
-    afterEach(function() {
+    afterEach(function () {
       if (slider) {
         slider = slider.release();
         document.body.innerHTML = '';
       }
     });
   });
-  describe('Click on slider', function() {
+  describe('Click on slider', function () {
     let container;
     let slider;
     let track;
     let mockRaf;
-    beforeEach(function() {
+    beforeEach(function () {
       mockRaf = createMockRaf();
       spyOn(window, 'requestAnimationFrame').and.callFake(mockRaf.raf);
       container = document.createElement('div');
@@ -145,14 +145,14 @@ describe('Test slider', function() {
       track = document.querySelector('.bx--slider__track');
       mockRaf.step({ count: 1 });
     });
-    it('Should change value on click', function() {
+    it('Should change value on click', function () {
       const event = new CustomEvent('click', { bubbles: true });
       event.clientX = 0;
       track.dispatchEvent(event);
       mockRaf.step({ count: 1 });
       expect(slider.getInputProps().value).toBe(0);
     });
-    afterEach(function() {
+    afterEach(function () {
       if (slider) {
         slider = slider.release();
         document.body.innerHTML = '';
diff --git a/packages/components/tests/spec/structured-list_spec.js b/packages/components/tests/spec/structured-list_spec.js
index 42a39c34e424..cda20b4f441d 100644
--- a/packages/components/tests/spec/structured-list_spec.js
+++ b/packages/components/tests/spec/structured-list_spec.js
@@ -2,13 +2,13 @@ import StructuredList from '../../src/components/structured-list/structured-list
 import HTML from '../../html/structured-list/structured-list--selection.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('StructuredList', function() {
-  describe('Constructor', function() {
+describe('StructuredList', function () {
+  describe('Constructor', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeAll(function() {
+    beforeAll(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -16,7 +16,7 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should throw if root element is not given', function() {
+    it('should throw if root element is not given', function () {
       expect(() => {
         new StructuredList();
       }).toThrowError(
@@ -25,7 +25,7 @@ describe('StructuredList', function() {
       );
     });
 
-    it('should throw if root element is not a DOM element', function() {
+    it('should throw if root element is not a DOM element', function () {
       expect(() => {
         new StructuredList(document.createTextNode(''));
       }).toThrowError(
@@ -34,7 +34,7 @@ describe('StructuredList', function() {
       );
     });
 
-    it('should set default options', function() {
+    it('should set default options', function () {
       // Spread operator does not take non-owning props
       const { selectorListInput, ...options } = Object.getPrototypeOf(
         instance.options
@@ -50,18 +50,18 @@ describe('StructuredList', function() {
       });
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_handleKeydownChecked(evt)', function() {
+  describe('_handleKeydownChecked(evt)', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -69,7 +69,7 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should be called on "enter" keydown event', function() {
+    it('should be called on "enter" keydown event', function () {
       spyOn(instance, '_handleKeydownChecked');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -81,7 +81,7 @@ describe('StructuredList', function() {
       expect(instance._handleKeydownChecked).toHaveBeenCalled();
     });
 
-    it('should be called on "space" keydown event', function() {
+    it('should be called on "space" keydown event', function () {
       spyOn(instance, '_handleKeydownChecked');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -93,7 +93,7 @@ describe('StructuredList', function() {
       expect(instance._handleKeydownChecked).toHaveBeenCalled();
     });
 
-    it('should not be called with another keydown event', function() {
+    it('should not be called with another keydown event', function () {
       spyOn(instance, '_handleKeydownChecked');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -105,18 +105,18 @@ describe('StructuredList', function() {
       expect(instance._handleKeydownChecked).not.toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_handleClick(evt)', function() {
+  describe('_handleClick(evt)', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -124,7 +124,7 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should be called on "click" keydown event', function() {
+    it('should be called on "click" keydown event', function () {
       spyOn(instance, '_handleClick');
       const event = Object.assign(
         new CustomEvent('click', {
@@ -135,7 +135,7 @@ describe('StructuredList', function() {
       expect(instance._handleClick).toHaveBeenCalled();
     });
 
-    it('should toggle classActive on a selectorRow', function() {
+    it('should toggle classActive on a selectorRow', function () {
       spyOn(instance, '_handleClick').and.callThrough();
       const event = Object.assign(
         new CustomEvent('click', {
@@ -151,18 +151,18 @@ describe('StructuredList', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_direction(evt)', function() {
+  describe('_direction(evt)', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -170,7 +170,7 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should be called on "up" keydown event', function() {
+    it('should be called on "up" keydown event', function () {
       spyOn(instance, '_direction');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -182,7 +182,7 @@ describe('StructuredList', function() {
       expect(instance._direction).toHaveBeenCalled();
     });
 
-    it('should be called on "down" keydown event', function() {
+    it('should be called on "down" keydown event', function () {
       spyOn(instance, '_direction');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -194,7 +194,7 @@ describe('StructuredList', function() {
       expect(instance._direction).toHaveBeenCalled();
     });
 
-    it('should return -1 on "up" key', function() {
+    it('should return -1 on "up" key', function () {
       const event = Object.assign(
         new CustomEvent('keydown', {
           bubbles: true,
@@ -205,7 +205,7 @@ describe('StructuredList', function() {
       expect(direction).toBe(-1);
     });
 
-    it('should return 1 on "down" key', function() {
+    it('should return 1 on "down" key', function () {
       const event = Object.assign(
         new CustomEvent('keydown', {
           bubbles: true,
@@ -216,7 +216,7 @@ describe('StructuredList', function() {
       expect(direction).toBe(1);
     });
 
-    it('should return undefined on other key presses', function() {
+    it('should return undefined on other key presses', function () {
       const event = Object.assign(
         new CustomEvent('keydown', {
           bubbles: true,
@@ -227,18 +227,18 @@ describe('StructuredList', function() {
       expect(direction).toBe(undefined);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_nextIndex()', function() {
+  describe('_nextIndex()', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -246,30 +246,30 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should be called', function() {
+    it('should be called', function () {
       spyOn(instance, '_nextIndex');
       instance._nextIndex([0, 1, 2, 3], 0, 1);
       expect(instance._nextIndex).toHaveBeenCalled();
     });
 
-    it('should return a number', function() {
+    it('should return a number', function () {
       const array = [0, 1, 2, 3];
       const result = instance._nextIndex(array, 0, 1);
       expect(typeof result).toBe('number');
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_handleInputChecked()', function() {
+  describe('_handleInputChecked()', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -277,24 +277,24 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should be called', function() {
+    it('should be called', function () {
       spyOn(instance, '_handleInputChecked');
       instance._handleInputChecked(0);
       expect(instance._handleInputChecked).toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
   });
 
-  describe('_handleKeydownArrow(evt)', function() {
+  describe('_handleKeydownArrow(evt)', function () {
     let instance;
     let element;
     let wrapper;
 
-    beforeEach(function() {
+    beforeEach(function () {
       wrapper = document.createElement('div');
       wrapper.innerHTML = HTML;
       document.body.appendChild(wrapper);
@@ -302,7 +302,7 @@ describe('StructuredList', function() {
       instance = new StructuredList(element);
     });
 
-    it('should be called on "up" keydown event', function() {
+    it('should be called on "up" keydown event', function () {
       spyOn(instance, '_handleKeydownArrow');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -314,7 +314,7 @@ describe('StructuredList', function() {
       expect(instance._handleKeydownArrow).toHaveBeenCalled();
     });
 
-    it('should be called on "down" keydown event', function() {
+    it('should be called on "down" keydown event', function () {
       spyOn(instance, '_handleKeydownArrow');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -326,7 +326,7 @@ describe('StructuredList', function() {
       expect(instance._handleKeydownArrow).toHaveBeenCalled();
     });
 
-    it('should not be called with another keydown event', function() {
+    it('should not be called with another keydown event', function () {
       spyOn(instance, '_handleKeydownArrow');
       const event = Object.assign(
         new CustomEvent('keydown', {
@@ -338,7 +338,7 @@ describe('StructuredList', function() {
       expect(instance._handleKeydownArrow).not.toHaveBeenCalled();
     });
 
-    afterEach(function() {
+    afterEach(function () {
       instance.release();
       document.body.removeChild(wrapper);
     });
diff --git a/packages/components/tests/spec/tabs_spec.js b/packages/components/tests/spec/tabs_spec.js
index 624a73b64553..5d2048ada847 100644
--- a/packages/components/tests/spec/tabs_spec.js
+++ b/packages/components/tests/spec/tabs_spec.js
@@ -1,9 +1,9 @@
 import Tab from '../../src/components/tabs/tabs';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test tabs', function() {
-  describe('Constructor', function() {
-    it('Should set default options', function() {
+describe('Test tabs', function () {
+  describe('Constructor', function () {
+    it('Should set default options', function () {
       spyOn(Tab.prototype, '_updateTriggerText');
       const tab = new Tab(document.createElement('div'));
       expect(flattenOptions(tab.options)).toEqual({
@@ -25,7 +25,7 @@ describe('Test tabs', function() {
       });
     });
 
-    it('Should initialize currently selected tab item for narrow screen', function() {
+    it('Should initialize currently selected tab item for narrow screen', function () {
       const triggerTextNode = document.createElement('div');
       triggerTextNode.classList.add('bx--tabs-trigger-text');
 
@@ -46,7 +46,7 @@ describe('Test tabs', function() {
       expect(triggerTextNode.textContent).toBe('0');
     });
 
-    it('Should deal with a condition with no selected item when constructor runs', function() {
+    it('Should deal with a condition with no selected item when constructor runs', function () {
       const element = document.createElement('div');
       const buttonNode = document.createElement('div');
       buttonNode.classList.add('bx--tabs__nav-item');
@@ -57,12 +57,12 @@ describe('Test tabs', function() {
     });
   });
 
-  describe('Toggling drop down for narrow screen', function() {
+  describe('Toggling drop down for narrow screen', function () {
     let element;
     let triggerNode;
     let menuNode;
 
-    beforeAll(function() {
+    beforeAll(function () {
       spyOn(Tab.prototype, '_updateTriggerText');
 
       triggerNode = document.createElement('div');
@@ -80,7 +80,7 @@ describe('Test tabs', function() {
       new Tab(element);
     });
 
-    it('Should show drop down upon hitting trigger button', function() {
+    it('Should show drop down upon hitting trigger button', function () {
       menuNode.classList.add('bx--tabs__nav--hidden');
       triggerNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(menuNode.classList.contains('bx--tabs__nav--hidden')).toBe(false);
@@ -89,7 +89,7 @@ describe('Test tabs', function() {
       );
     });
 
-    it('Should hide drop down upon hitting trigger button', function() {
+    it('Should hide drop down upon hitting trigger button', function () {
       triggerNode.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(menuNode.classList.contains('bx--tabs__nav--hidden')).toBe(true);
       expect(triggerNode.classList.contains('bx--tabs-trigger--open')).toBe(
@@ -97,21 +97,21 @@ describe('Test tabs', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       menuNode.classList.remove('bx--tabs__nav--hidden');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(element);
     });
   });
 
-  describe('Setting active tab', function() {
+  describe('Setting active tab', function () {
     let element;
     let buttonNodes;
     let triggerTextNode;
 
-    beforeAll(function() {
+    beforeAll(function () {
       spyOn(Tab.prototype, '_updateMenuState');
 
       triggerTextNode = document.createElement('div');
@@ -135,7 +135,7 @@ describe('Test tabs', function() {
       new Tab(element);
     });
 
-    beforeEach(function() {
+    beforeEach(function () {
       buttonNodes.forEach((buttonNode, i) => {
         buttonNode.classList.remove('bx--tabs__nav-item--disabled');
         buttonNode.classList[i === 0 ? 'add' : 'remove'](
@@ -144,7 +144,7 @@ describe('Test tabs', function() {
       });
     });
 
-    it('Should update active tab upon clicking', function() {
+    it('Should update active tab upon clicking', function () {
       buttonNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
         buttonNodes[0].classList.contains('bx--tabs__nav-item--selected')
@@ -157,7 +157,7 @@ describe('Test tabs', function() {
       ).toBe(false);
     });
 
-    it('Should skip disabled tab upon right key', function() {
+    it('Should skip disabled tab upon right key', function () {
       buttonNodes[1].classList.add('bx--tabs__nav-item--disabled');
       const defaultPrevented = element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 39 })
@@ -174,7 +174,7 @@ describe('Test tabs', function() {
       ).toBe(true);
     });
 
-    it('Should avoid activating disabled tab on click', function() {
+    it('Should avoid activating disabled tab on click', function () {
       buttonNodes[1].classList.add('bx--tabs__nav-item--disabled');
       buttonNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(
@@ -188,12 +188,12 @@ describe('Test tabs', function() {
       ).toBe(false);
     });
 
-    it('Should update currently selected tab item for narrow screen', function() {
+    it('Should update currently selected tab item for narrow screen', function () {
       buttonNodes[1].dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(triggerTextNode.textContent).toBe(buttonNodes[1].textContent);
     });
 
-    it('Should update active tab upon right key', function() {
+    it('Should update active tab upon right key', function () {
       const defaultPrevented = element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 39 })
       );
@@ -209,7 +209,7 @@ describe('Test tabs', function() {
       ).toBe(false);
     });
 
-    it('Should handle out of range index', function() {
+    it('Should handle out of range index', function () {
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 39 })
       );
@@ -230,7 +230,7 @@ describe('Test tabs', function() {
       ).toBe(false);
     });
 
-    it('Should update active tab upon left key', function() {
+    it('Should update active tab upon left key', function () {
       const defaultPrevented = element.dispatchEvent(
         Object.assign(new CustomEvent('keydown'), { which: 37 })
       );
@@ -246,7 +246,7 @@ describe('Test tabs', function() {
       ).toBe(true);
     });
 
-    it('Should focus on the new active tab upon keyboard navigation', function() {
+    it('Should focus on the new active tab upon keyboard navigation', function () {
       const link = document.createElement('a');
       spyOn(link, 'focus');
       link.classList.add('bx--tabs__nav-link');
@@ -261,7 +261,7 @@ describe('Test tabs', function() {
       }
     });
 
-    afterAll(function() {
+    afterAll(function () {
       document.body.removeChild(element);
     });
   });
diff --git a/packages/components/tests/spec/tile_spec.js b/packages/components/tests/spec/tile_spec.js
index 4eb3bd356b29..d6edaf5dcf47 100644
--- a/packages/components/tests/spec/tile_spec.js
+++ b/packages/components/tests/spec/tile_spec.js
@@ -4,11 +4,11 @@ import expandableTile from '../../html/tile/tile--expandable.html';
 import selectableTile from '../../html/tile/tile--selectable.html';
 import flattenOptions from '../utils/flatten-options';
 
-describe('Test tile', function() {
-  describe('Constructor', function() {
+describe('Test tile', function () {
+  describe('Constructor', function () {
     let tile;
 
-    it('Should throw if root element is not given', function() {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         tile = new Tile();
       }).toThrowError(
@@ -17,7 +17,7 @@ describe('Test tile', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         tile = new Tile(document.createTextNode(''));
       }).toThrowError(
@@ -26,7 +26,7 @@ describe('Test tile', function() {
       );
     });
 
-    it('Should set default options', function() {
+    it('Should set default options', function () {
       const container = document.createElement('div');
       container.innerHTML = clickableTile;
       document.body.appendChild(container);
@@ -42,45 +42,45 @@ describe('Test tile', function() {
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (tile) {
         tile = tile.release();
       }
     });
   });
 
-  describe('Test _hookActions', function() {
+  describe('Test _hookActions', function () {
     let instance;
     let tileElement;
     const container = document.createElement('div');
     container.innerHTML = clickableTile;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       tileElement = container.querySelector('[data-tile]');
       instance = new Tile(tileElement);
     });
 
-    it('Should be called', function() {
+    it('Should be called', function () {
       spyOn(instance, '_hookActions');
       instance._hookActions();
       expect(instance._hookActions).toHaveBeenCalled();
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Test clickable tile', function() {
+  describe('Test clickable tile', function () {
     let instance;
     let tileElement;
     let tileElementInitialState;
     const container = document.createElement('div');
     container.innerHTML = clickableTile;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       tileElement = container.querySelector('[data-tile]');
       tileElementInitialState = tileElement.classList.contains(
@@ -89,30 +89,30 @@ describe('Test tile', function() {
       instance = new Tile(tileElement);
     });
 
-    it('Should not have the is-clicked class before its been clicked', function() {
+    it('Should not have the is-clicked class before its been clicked', function () {
       expect(tileElementInitialState).toBe(false);
     });
 
-    it('Should have the is-clicked class after its been clicked', function() {
+    it('Should have the is-clicked class after its been clicked', function () {
       tileElement.classList.remove('bx--tile--is-clicked');
       tileElement.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(tileElement.classList.contains('bx--tile--is-clicked')).toBe(true);
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Test expandable tile', function() {
+  describe('Test expandable tile', function () {
     let instance;
     let tileElement;
     let tileElementInitialState;
     const container = document.createElement('div');
     container.innerHTML = expandableTile;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       tileElement = container.querySelector('[data-tile]');
       tileElementInitialState = tileElement.classList.contains(
@@ -121,11 +121,11 @@ describe('Test tile', function() {
       instance = new Tile(tileElement);
     });
 
-    it('Should not have the is-expanded class before its been clicked', function() {
+    it('Should not have the is-expanded class before its been clicked', function () {
       expect(tileElementInitialState).toBe(false);
     });
 
-    it('Should have the is-expanded class after its been clicked', function() {
+    it('Should have the is-expanded class after its been clicked', function () {
       tileElement.classList.remove('bx--tile--is-expanded');
       tileElement.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(tileElement.classList.contains('bx--tile--is-expanded')).toBe(
@@ -144,20 +144,20 @@ describe('Test tile', function() {
     //   expect(tileElement.classList.contains('bx--tile--is-expanded')).toBe(true);
     // });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(container);
     });
   });
 
-  describe('Test selectable tile', function() {
+  describe('Test selectable tile', function () {
     let instance;
     let tileElement;
     let tileElementInitialState;
     const container = document.createElement('div');
     container.innerHTML = selectableTile;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       tileElement = container.querySelector('[data-tile]');
       tileElementInitialState = tileElement.classList.contains(
@@ -166,11 +166,11 @@ describe('Test tile', function() {
       instance = new Tile(tileElement);
     });
 
-    it('Should not have the is-clicked class before its been clicked', function() {
+    it('Should not have the is-clicked class before its been clicked', function () {
       expect(tileElementInitialState).toBe(false);
     });
 
-    it('Should have the is-clicked class after its been clicked', function() {
+    it('Should have the is-clicked class after its been clicked', function () {
       tileElement.classList.remove('bx--tile--is-selected');
       tileElement.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(tileElement.classList.contains('bx--tile--is-selected')).toBe(
@@ -178,7 +178,7 @@ describe('Test tile', function() {
       );
     });
 
-    afterAll(function() {
+    afterAll(function () {
       instance.release();
       document.body.removeChild(container);
     });
diff --git a/packages/components/tests/spec/toolbar_spec.js b/packages/components/tests/spec/toolbar_spec.js
index 8d1b77630a2d..ce026a814335 100644
--- a/packages/components/tests/spec/toolbar_spec.js
+++ b/packages/components/tests/spec/toolbar_spec.js
@@ -2,9 +2,9 @@ import '../../demo/polyfills/custom-event';
 import Toolbar from '../../src/components/toolbar/toolbar';
 import ToolbarHTML from '../../html/toolbar/toolbar.html';
 
-describe('Test toolbar', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test toolbar', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Toolbar();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Test toolbar', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Toolbar(document.createTextNode(''));
       }).toThrowError(
@@ -23,44 +23,44 @@ describe('Test toolbar', function() {
     });
   });
 
-  describe('Clicking on search', function() {
+  describe('Clicking on search', function () {
     let search;
     const container = document.createElement('div');
     container.innerHTML = ToolbarHTML;
 
-    beforeEach(function() {
+    beforeEach(function () {
       document.body.appendChild(container);
       new Toolbar(document.querySelector('[data-toolbar]'));
       search = document.querySelector('[data-toolbar-search]');
     });
 
-    it('Should open search on click', function() {
+    it('Should open search on click', function () {
       search.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(search.classList.contains('bx--toolbar-search--active')).toBe(
         true
       );
     });
 
-    it('Should close search on click outside the toolbar', function() {
+    it('Should close search on click outside the toolbar', function () {
       container.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(search.classList.contains('bx--toolbar-search--active')).toBe(
         false
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (document.body.contains(container)) {
         document.body.removeChild(container);
       }
     });
   });
 
-  describe('Keydown on search', function() {
+  describe('Keydown on search', function () {
     let container;
     let search;
     let toolbar;
 
-    beforeEach(function() {
+    beforeEach(function () {
       container = document.createElement('div');
       container.innerHTML = ToolbarHTML;
       document.body.appendChild(container);
@@ -68,7 +68,7 @@ describe('Test toolbar', function() {
       search = container.querySelector('[data-toolbar-search]');
     });
 
-    it('Should close search on esc keydown', function() {
+    it('Should close search on esc keydown', function () {
       const event = new CustomEvent('keydown', { bubbles: true });
       event.which = 27;
       search.dispatchEvent(event);
@@ -77,7 +77,7 @@ describe('Test toolbar', function() {
       );
     });
 
-    afterEach(function() {
+    afterEach(function () {
       toolbar.release();
       if (document.body.contains(container)) {
         document.body.removeChild(container);
@@ -86,31 +86,31 @@ describe('Test toolbar', function() {
     });
   });
 
-  describe('Exclusive search box', function() {
+  describe('Exclusive search box', function () {
     let container;
     const toolbars = [];
 
-    beforeAll(function() {
+    beforeAll(function () {
       container = document.createElement('div');
       container.innerHTML = ToolbarHTML + ToolbarHTML;
       document.body.appendChild(container);
       toolbars.push(
         ...[...container.querySelectorAll('[data-toolbar]')].map(
-          elem => new Toolbar(elem)
+          (elem) => new Toolbar(elem)
         )
       );
     });
 
-    beforeEach(function() {
-      toolbars.forEach(toolbar => {
+    beforeEach(function () {
+      toolbars.forEach((toolbar) => {
         toolbar.element
           .querySelector(toolbar.options.selectorSearch)
           .classList.remove(toolbar.classSearchActive);
       });
     });
 
-    it('Should make the search box exclusive upon clicking on one of the search boxes', function() {
-      const searches = toolbars.map(toolbar =>
+    it('Should make the search box exclusive upon clicking on one of the search boxes', function () {
+      const searches = toolbars.map((toolbar) =>
         toolbar.element.querySelector(toolbar.options.selectorSearch)
       );
       searches[0].classList.add(toolbars[0].classSearchActive);
@@ -123,7 +123,7 @@ describe('Test toolbar', function() {
       );
     });
 
-    afterAll(function() {
+    afterAll(function () {
       for (let toolbar = toolbars.pop(); toolbar; toolbar = toolbars.pop()) {
         toolbar.release();
       }
diff --git a/packages/components/tests/spec/tooltip--simple_spec.js b/packages/components/tests/spec/tooltip--simple_spec.js
index 487ee832f640..61d652f09bfc 100644
--- a/packages/components/tests/spec/tooltip--simple_spec.js
+++ b/packages/components/tests/spec/tooltip--simple_spec.js
@@ -2,9 +2,9 @@ import Tooltip from '../../src/components/tooltip/tooltip--simple';
 import TooltipDefinitionHTML from '../../html/tooltip/tooltip--definition.html';
 import TooltipIconHTML from '../../html/tooltip/tooltip--icon.html';
 
-describe('Test simple tooltip', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test simple tooltip', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Tooltip();
       }).toThrowError(
@@ -13,7 +13,7 @@ describe('Test simple tooltip', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Tooltip(document.createTextNode(''));
       }).toThrowError(
@@ -23,7 +23,7 @@ describe('Test simple tooltip', function() {
     });
   });
 
-  describe('Showing/hiding definition tooltip', function() {
+  describe('Showing/hiding definition tooltip', function () {
     const container = document.createElement('div');
     container.innerHTML = TooltipDefinitionHTML;
 
@@ -31,22 +31,22 @@ describe('Test simple tooltip', function() {
     const button = container.querySelector('.bx--tooltip__trigger--definition');
     let tooltip;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       tooltip = new Tooltip(element);
     });
 
-    it('Should not have hidden class after mouseenter', function() {
+    it('Should not have hidden class after mouseenter', function () {
       element.dispatchEvent(new CustomEvent('mouseenter', { bubbles: true }));
       expect(button.classList.contains('bx--tooltip--hidden')).toBe(false);
     });
 
-    it('Should not have hidden class after focus', function() {
+    it('Should not have hidden class after focus', function () {
       element.dispatchEvent(new CustomEvent('focus', { bubbles: true }));
       expect(button.classList.contains('bx--tooltip--hidden')).toBe(false);
     });
 
-    it('Should have hidden class after Esc keydown', function() {
+    it('Should have hidden class after Esc keydown', function () {
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown', { bubbles: true }), {
           which: 27,
@@ -55,11 +55,11 @@ describe('Test simple tooltip', function() {
       expect(button.classList.contains('bx--tooltip--hidden')).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       button.classList.remove('bx--tooltip--hidden');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (document.body.contains(button)) {
         button.parentNode.removeChild(button);
       }
@@ -71,31 +71,31 @@ describe('Test simple tooltip', function() {
     });
   });
 
-  describe('Showing/hiding icon tooltip', function() {
+  describe('Showing/hiding icon tooltip', function () {
     const container = document.createElement('div');
     container.innerHTML = TooltipIconHTML;
 
     const element = container.querySelector('[data-tooltip-icon]');
     let tooltip;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       tooltip = new Tooltip(element);
     });
 
-    it('Should not have hidden class after mouseenter', function() {
+    it('Should not have hidden class after mouseenter', function () {
       element.dispatchEvent(new CustomEvent('mouseenter', { bubbles: true }));
       expect(element.classList.contains('bx--tooltip--hidden')).toBe(false);
     });
 
-    it('Should have visible class after mouseenter', function() {
+    it('Should have visible class after mouseenter', function () {
       element.dispatchEvent(new CustomEvent('mouseenter', { bubbles: true }));
       expect(element.classList.contains('bx--tooltip--visible')).toBe(true);
     });
 
-    it('Should not have visible class after mouseleave', async function() {
+    it('Should not have visible class after mouseleave', async function () {
       return Tooltip.__with__({
-        debounce: fn => fn,
+        debounce: (fn) => fn,
       })(() => {
         tooltip.release();
         tooltip = new Tooltip(element);
@@ -104,12 +104,12 @@ describe('Test simple tooltip', function() {
       });
     });
 
-    it('Should not have hidden class after focus', function() {
+    it('Should not have hidden class after focus', function () {
       element.dispatchEvent(new CustomEvent('focus', { bubbles: true }));
       expect(element.classList.contains('bx--tooltip--hidden')).toBe(false);
     });
 
-    it('Should have hidden class after Esc keydown', function() {
+    it('Should have hidden class after Esc keydown', function () {
       element.dispatchEvent(
         Object.assign(new CustomEvent('keydown', { bubbles: true }), {
           which: 27,
@@ -118,11 +118,11 @@ describe('Test simple tooltip', function() {
       expect(element.classList.contains('bx--tooltip--hidden')).toBe(true);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       element.classList.remove('bx--tooltip--hidden');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (document.body.contains(element)) {
         element.parentNode.removeChild(element);
       }
diff --git a/packages/components/tests/spec/tooltip_spec.js b/packages/components/tests/spec/tooltip_spec.js
index c9b6db4cacf3..054ccd2fae9b 100644
--- a/packages/components/tests/spec/tooltip_spec.js
+++ b/packages/components/tests/spec/tooltip_spec.js
@@ -1,9 +1,9 @@
 import Tooltip from '../../src/components/tooltip/tooltip';
 import HTML from '../../html/tooltip/tooltip.html';
 
-describe('Test tooltip', function() {
-  describe('Constructor', function() {
-    it('Should throw if root element is not given', function() {
+describe('Test tooltip', function () {
+  describe('Constructor', function () {
+    it('Should throw if root element is not given', function () {
       expect(() => {
         new Tooltip();
       }).toThrowError(
@@ -12,7 +12,7 @@ describe('Test tooltip', function() {
       );
     });
 
-    it('Should throw if root element is not a DOM element', function() {
+    it('Should throw if root element is not a DOM element', function () {
       expect(() => {
         new Tooltip(document.createTextNode(''));
       }).toThrowError(
@@ -22,7 +22,7 @@ describe('Test tooltip', function() {
     });
   });
 
-  describe('Showing/hiding', function() {
+  describe('Showing/hiding', function () {
     const container = document.createElement('div');
     container.innerHTML = HTML;
 
@@ -30,33 +30,33 @@ describe('Test tooltip', function() {
     const floating = container.querySelector('.bx--tooltip');
     let tooltip;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       return Tooltip.__with__({
-        debounce: fn => fn,
+        debounce: (fn) => fn,
       })(() => {
         tooltip = new Tooltip(element);
       });
     });
 
-    it('Content should be programmatically focusable', function() {
+    it('Content should be programmatically focusable', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       const content = floating.querySelector('.bx--tooltip__content');
 
       expect(content.getAttribute('tabindex')).toBe('-1');
     });
 
-    it('Should show the tooltip upon clicking', function() {
+    it('Should show the tooltip upon clicking', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(floating.classList.contains('bx--tooltip--shown')).toBe(true);
     });
 
-    it('Should apply focus to a child element upon opening', function() {
+    it('Should apply focus to a child element upon opening', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
       expect(document.activeElement.closest('.bx--tooltip')).not.toBe(null);
     });
 
-    it('Should remain open upon focusing the content within the tooltip', function() {
+    it('Should remain open upon focusing the content within the tooltip', function () {
       element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
 
       const content = floating.querySelector('.bx--tooltip__content');
@@ -66,17 +66,17 @@ describe('Test tooltip', function() {
 
     // Known bug: https://github.com/carbon-design-system/carbon/issues/3835
 
-    it('Should hide the tooltip upon blurring', function() {
+    it('Should hide the tooltip upon blurring', function () {
       floating.classList.add('bx--tooltip--shown');
       element.dispatchEvent(new CustomEvent('blur', { bubbles: true }));
       expect(floating.classList.contains('bx--tooltip--shown')).toBe(false);
     });
 
-    afterEach(function() {
+    afterEach(function () {
       floating.classList.remove('bx--tooltip--shown');
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (document.body.contains(floating)) {
         floating.parentNode.removeChild(floating);
       }
@@ -88,7 +88,7 @@ describe('Test tooltip', function() {
     });
   });
 
-  describe('Automatic creation', function() {
+  describe('Automatic creation', function () {
     const container = document.createElement('div');
     container.innerHTML = HTML;
 
@@ -96,21 +96,21 @@ describe('Test tooltip', function() {
     const floating = container.querySelector('.bx--tooltip');
     let initContext;
 
-    beforeAll(function() {
+    beforeAll(function () {
       document.body.appendChild(container);
       initContext = Tooltip.init();
     });
 
-    it('Should create an instance upon clicking', function() {
+    it('Should create an instance upon clicking', function () {
       return Tooltip.__with__({
-        debounce: fn => fn,
+        debounce: (fn) => fn,
       })(() => {
         element.dispatchEvent(new CustomEvent('click', { bubbles: true }));
         expect(floating.classList.contains('bx--tooltip--shown')).toBe(true);
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       floating.classList.remove('bx--tooltip--shown');
       const tooltip = Tooltip.components.get(element);
       if (tooltip) {
@@ -118,7 +118,7 @@ describe('Test tooltip', function() {
       }
     });
 
-    afterAll(function() {
+    afterAll(function () {
       if (initContext) {
         initContext.release();
       }
diff --git a/packages/components/tests/spec/watch_spec.js b/packages/components/tests/spec/watch_spec.js
index 03f4b2a994f2..32246055340c 100644
--- a/packages/components/tests/spec/watch_spec.js
+++ b/packages/components/tests/spec/watch_spec.js
@@ -19,7 +19,7 @@ import watch from '../../src/globals/js/watch';
 
 settings.disableAutoInit = true;
 
-describe('Test watch mode', function() {
+describe('Test watch mode', function () {
   const watchOptions = { foo: 'Foo' };
   const ClassInitedBySearch = class extends mixin(
     createComponent,
@@ -66,7 +66,7 @@ describe('Test watch mode', function() {
     ClassInitedByLauncher,
   };
 
-  beforeAll(function() {
+  beforeAll(function () {
     spyOn(ClassInitedBySearch, 'init').and.callThrough();
     spyOn(ClassInitedBySearch.prototype, 'release').and.callThrough();
     spyOn(ClassInitedByEvent, 'init').and.callThrough();
@@ -75,12 +75,12 @@ describe('Test watch mode', function() {
     spyOn(ClassInitedByLauncher.prototype, 'release').and.callThrough();
   });
 
-  describe('Handling regular components', function() {
+  describe('Handling regular components', function () {
     let lastTarget;
     let handle;
     let element;
 
-    beforeAll(function() {
+    beforeAll(function () {
       const origObserve = MutationObserver.prototype.observe;
       spyOn(MutationObserver.prototype, 'observe').and.callFake(
         function stubObserveImpl(target, options) {
@@ -90,7 +90,7 @@ describe('Test watch mode', function() {
       );
     });
 
-    it('Should throw if given element is neither a DOM element or a document', function() {
+    it('Should throw if given element is neither a DOM element or a document', function () {
       expect(() => {
         handle = watch(document.createTextNode(''));
       }).toThrowError(
@@ -99,12 +99,12 @@ describe('Test watch mode', function() {
       );
     });
 
-    it('Should look at document if no element is given', function() {
+    it('Should look at document if no element is given', function () {
       handle = watch();
       expect(lastTarget).toBe(document);
     });
 
-    it('Should instantiate the components', async function() {
+    it('Should instantiate the components', async function () {
       await watch.__with__({ components })(async () => {
         handle = watch(document, watchOptions);
 
@@ -133,7 +133,7 @@ describe('Test watch mode', function() {
       });
     });
 
-    it('Should release the components', async function() {
+    it('Should release the components', async function () {
       await watch.__with__({ components })(async () => {
         handle = watch();
 
@@ -185,7 +185,7 @@ describe('Test watch mode', function() {
       });
     });
 
-    it('Should release the components even if the removed node is of the component', async function() {
+    it('Should release the components even if the removed node is of the component', async function () {
       await watch.__with__({ components })(async () => {
         handle = watch();
 
@@ -203,7 +203,7 @@ describe('Test watch mode', function() {
       });
     });
 
-    it('Should stop instantiating components once the handle is released', async function() {
+    it('Should stop instantiating components once the handle is released', async function () {
       await watch.__with__({ components })(async () => {
         handle = watch(document, watchOptions);
 
@@ -234,7 +234,7 @@ describe('Test watch mode', function() {
       });
     });
 
-    afterEach(function() {
+    afterEach(function () {
       if (element && element.parentNode) {
         element.parentNode.removeChild(element);
         element = null;
@@ -245,7 +245,7 @@ describe('Test watch mode', function() {
     });
   });
 
-  afterEach(function() {
+  afterEach(function () {
     ClassInitedByLauncher.prototype.release.calls.reset();
     ClassInitedByEvent.prototype.release.calls.reset();
     ClassInitedBySearch.prototype.release.calls.reset();
diff --git a/packages/components/tests/styles-test.js b/packages/components/tests/styles-test.js
index 642def1aa5d7..8fe9d7c0f40a 100644
--- a/packages/components/tests/styles-test.js
+++ b/packages/components/tests/styles-test.js
@@ -23,7 +23,7 @@ const render = promisify(sass.render);
 
 describe('styles', () => {
   jest.setTimeout(20000);
-  it.each(files)('%s should compile', async relativeFilePath => {
+  it.each(files)('%s should compile', async (relativeFilePath) => {
     const filepath = path.join(cwd, relativeFilePath);
     try {
       expect(
diff --git a/packages/components/tools/babel-plugin-pure-assignment.js b/packages/components/tools/babel-plugin-pure-assignment.js
index b5fb7aa076fa..396fb3264004 100644
--- a/packages/components/tools/babel-plugin-pure-assignment.js
+++ b/packages/components/tools/babel-plugin-pure-assignment.js
@@ -53,7 +53,7 @@ module.exports = function convertPureAssignment(babel) {
         const { left, computed, optional } = expression;
         const comment =
           left.trailingComments &&
-          left.trailingComments.find(item =>
+          left.trailingComments.find((item) =>
             regexPureClassProperty.test(item.value)
           );
         if (
@@ -70,7 +70,7 @@ module.exports = function convertPureAssignment(babel) {
             binding &&
             init.type === 'CallExpression' &&
             init.leadingComments &&
-            init.leadingComments.some(item => regexPure.test(item.value))
+            init.leadingComments.some((item) => regexPure.test(item.value))
           ) {
             const list = mapGetOrCreate(
               this.pureAssignmentsMap,
@@ -102,19 +102,19 @@ module.exports = function convertPureAssignment(babel) {
       if (pureAssignments) {
         const declarator = t.cloneDeep(path.node);
         const { body } = declarator.init.callee.body;
-        const index = body.findIndex(item => item.type === 'ReturnStatement');
+        const index = body.findIndex((item) => item.type === 'ReturnStatement');
         if (index >= 0) {
           const { argument } = body[index];
           if (argument.type === 'Identifier') {
-            const assignmentsToInsert = pureAssignments.map(node => {
+            const assignmentsToInsert = pureAssignments.map((node) => {
               const clone = t.cloneDeep(node);
               const { left, right } = clone.expression;
               left.object = t.cloneDeep(argument);
               left.trailingComments = left.trailingComments.filter(
-                item => !regexPureClassProperty.test(item.value)
+                (item) => !regexPureClassProperty.test(item.value)
               );
               right.leadingComments = right.leadingComments.filter(
-                item => !regexPureClassProperty.test(item.value)
+                (item) => !regexPureClassProperty.test(item.value)
               );
               return clone;
             });
diff --git a/packages/components/tools/templates.js b/packages/components/tools/templates.js
index 00c5cddb5243..f280a059267b 100644
--- a/packages/components/tools/templates.js
+++ b/packages/components/tools/templates.js
@@ -43,8 +43,8 @@ try {
     path.dirname(require.resolve('@frctl/fractal')),
     'core/log'
   ));
-  ['log', 'error', 'warn'].forEach(name => {
-    logger.on(name, evt => {
+  ['log', 'error', 'warn'].forEach((name) => {
+    logger.on(name, (evt) => {
       console[name](`Fractal ${name}:`, evt); // eslint-disable-line no-console
     });
   });
@@ -56,15 +56,15 @@ try {
  * @param {string} glob A glob.
  * @returns {Set<string, string>} A set of file contents matching the given glob, keyed by the basename of the file.
  */
-const getContents = glob =>
-  globby(glob).then(filePaths => {
+const getContents = (glob) =>
+  globby(glob).then((filePaths) => {
     if (filePaths.length === 0) {
       return undefined;
     }
     const contents = new Map();
     return Promise.all(
-      filePaths.map(filePath =>
-        readFile(filePath, { encoding: 'utf8' }).then(content => {
+      filePaths.map((filePath) =>
+        readFile(filePath, { encoding: 'utf8' }).then((content) => {
           contents.set(
             path.basename(filePath, path.extname(filePath)),
             content
@@ -79,8 +79,8 @@ const getContents = glob =>
  * @param {string} glob A glob.
  * @returns {Set<string, string>} A set of file contents matching the given glob, keyed by the basename of the file.
  */
-const loadContents = glob =>
-  getContents(glob).then(contents => {
+const loadContents = (glob) =>
+  getContents(glob).then((contents) => {
     contents.forEach((content, templateName) => {
       Handlebars.registerPartial(templateName, content);
       contents.set(templateName, Handlebars.compile(content));
@@ -141,7 +141,7 @@ const renderComponent = ({ layout, concat, layoutContext } = {}, handle) =>
           'The most typical cause is a JavaScript error in one of the `*.config.js` files.'
       );
     }
-    componentSource.forEach(metadata => {
+    componentSource.forEach((metadata) => {
       const items = metadata.isCollection
         ? metadata
         : !metadata.meta.removed &&
@@ -152,8 +152,8 @@ const renderComponent = ({ layout, concat, layoutContext } = {}, handle) =>
         const filteredItems =
           !handle || handle === metadata.handle
             ? items
-            : items.filter(item => handle === item.handle);
-        filteredItems.forEach(item => {
+            : items.filter((item) => handle === item.handle);
+        filteredItems.forEach((item) => {
           const { handle: itemHandle, baseHandle, context, meta } = item;
           const template =
             !meta.removed &&
@@ -184,7 +184,7 @@ const renderComponent = ({ layout, concat, layoutContext } = {}, handle) =>
       return renderedItems;
     }
     const accumulated = [];
-    renderedItems.forEach(rendered => {
+    renderedItems.forEach((rendered) => {
       accumulated.push(rendered);
     });
     return accumulated.length > 0 ? accumulated.join('\n') : undefined;
diff --git a/packages/elements/tasks/build.js b/packages/elements/tasks/build.js
index f90b1930b64c..2b1b4ba6ed91 100644
--- a/packages/elements/tasks/build.js
+++ b/packages/elements/tasks/build.js
@@ -17,7 +17,7 @@ const packageJson = require('../package.json');
 
 const WORKSPACE_NODE_MODULES = path.resolve(__dirname, '../../../node_modules');
 const BUNDLE_DIR = path.resolve(__dirname, '../scss');
-const dependencies = Object.keys(packageJson.dependencies).map(key => {
+const dependencies = Object.keys(packageJson.dependencies).map((key) => {
   return [key, path.join(WORKSPACE_NODE_MODULES, key)];
 });
 
@@ -55,7 +55,7 @@ async function build() {
   });
 
   await Promise.all(
-    paths.map(async file => {
+    paths.map(async (file) => {
       const relativeImportPath = path.relative(
         path.dirname(file.path),
         BUNDLE_DIR
@@ -75,6 +75,6 @@ async function build() {
   );
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.error(error);
 });
diff --git a/packages/elements/tasks/clean.js b/packages/elements/tasks/clean.js
index 2be2143771a5..3178023fe8c6 100644
--- a/packages/elements/tasks/clean.js
+++ b/packages/elements/tasks/clean.js
@@ -15,7 +15,7 @@ const packageJson = require('../package.json');
 
 const WORKSPACE_NODE_MODULES = path.resolve(__dirname, '../../../node_modules');
 const BUNDLE_DIR = path.resolve(__dirname, '../scss');
-const dependencies = Object.keys(packageJson.dependencies).map(key => {
+const dependencies = Object.keys(packageJson.dependencies).map((key) => {
   return [key, path.join(WORKSPACE_NODE_MODULES, key)];
 });
 
@@ -27,6 +27,6 @@ async function clean() {
   );
 }
 
-clean().catch(error => {
+clean().catch((error) => {
   console.error(error);
 });
diff --git a/packages/icon-build-helpers/package.json b/packages/icon-build-helpers/package.json
index 98571a8e8d01..d2db6f5bea52 100644
--- a/packages/icon-build-helpers/package.json
+++ b/packages/icon-build-helpers/package.json
@@ -30,7 +30,7 @@
     "js-yaml": "^3.12.1",
     "klaw-sync": "^6.0.0",
     "memfs": "^3.0.4",
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.5",
     "prop-types": "^15.6.2",
     "react": "^16.6.0",
     "react-dom": "^16.6.0",
diff --git a/packages/icon-build-helpers/src/builders/plugins/virtual.js b/packages/icon-build-helpers/src/builders/plugins/virtual.js
index aeb00c1dee47..7a4084fda4a6 100644
--- a/packages/icon-build-helpers/src/builders/plugins/virtual.js
+++ b/packages/icon-build-helpers/src/builders/plugins/virtual.js
@@ -14,7 +14,7 @@ const PREFIX = 'virtual:';
 module.exports = function virtual(modules) {
   const resolvedIds = new Map();
 
-  Object.keys(modules).forEach(id => {
+  Object.keys(modules).forEach((id) => {
     resolvedIds.set(path.resolve(id), modules[id]);
   });
 
diff --git a/packages/icon-build-helpers/src/builders/react/builder.js b/packages/icon-build-helpers/src/builders/react/builder.js
index 5d2ec3e572ad..240d5459b391 100644
--- a/packages/icon-build-helpers/src/builders/react/builder.js
+++ b/packages/icon-build-helpers/src/builders/react/builder.js
@@ -44,8 +44,8 @@ const babelConfig = {
 };
 
 async function builder(metadata, { output }) {
-  const modules = metadata.icons.flatMap(icon => {
-    return icon.output.map(size => {
+  const modules = metadata.icons.flatMap((icon) => {
+    return icon.output.map((size) => {
       const { source } = createIconComponent(
         size.moduleName,
         size.descriptor,
@@ -218,7 +218,7 @@ const attributeDenylist = ['data', 'aria'];
  * @returns {boolean}
  */
 function shouldTransformAttribute(attribute) {
-  return attributeDenylist.every(prefix => !attribute.startsWith(prefix));
+  return attributeDenylist.every((prefix) => !attribute.startsWith(prefix));
 }
 
 /**
diff --git a/packages/icon-build-helpers/src/builders/react/components/__tests__/Icon-test.js b/packages/icon-build-helpers/src/builders/react/components/__tests__/Icon-test.js
index 80e8f6f0ce53..d9283a8e0b60 100644
--- a/packages/icon-build-helpers/src/builders/react/components/__tests__/Icon-test.js
+++ b/packages/icon-build-helpers/src/builders/react/components/__tests__/Icon-test.js
@@ -51,7 +51,7 @@ describe('Icon', () => {
 
   it('should forward refs to the rendered SVG DOM element', () => {
     let svg;
-    const ref = jest.fn(node => {
+    const ref = jest.fn((node) => {
       svg = node;
     });
     render(<Icon ref={ref} />, mountNode);
diff --git a/packages/icon-build-helpers/src/builders/vanilla.js b/packages/icon-build-helpers/src/builders/vanilla.js
index ce1e7ea94f03..13fe7b0a069c 100644
--- a/packages/icon-build-helpers/src/builders/vanilla.js
+++ b/packages/icon-build-helpers/src/builders/vanilla.js
@@ -35,8 +35,8 @@ const babelConfig = {
 };
 
 async function builder(metadata, { output }) {
-  const modules = metadata.icons.flatMap(icon => {
-    return icon.output.map(size => {
+  const modules = metadata.icons.flatMap((icon) => {
+    return icon.output.map((size) => {
       const source = `export default ${JSON.stringify(size.descriptor)};`;
       return {
         source,
diff --git a/packages/icon-build-helpers/src/builders/vue.js b/packages/icon-build-helpers/src/builders/vue.js
index cfab3dc92106..8de666b48ff5 100644
--- a/packages/icon-build-helpers/src/builders/vue.js
+++ b/packages/icon-build-helpers/src/builders/vue.js
@@ -37,8 +37,8 @@ const babelConfig = {
 };
 
 async function builder(metadata, { output }) {
-  const modules = metadata.icons.flatMap(icon => {
-    return icon.output.map(size => {
+  const modules = metadata.icons.flatMap((icon) => {
+    return icon.output.map((size) => {
       const source = createIconComponent(size.moduleName, size.descriptor);
       return {
         source,
diff --git a/packages/icon-build-helpers/src/metadata/extension.js b/packages/icon-build-helpers/src/metadata/extension.js
index ab35c4208896..7e43e2d872e7 100644
--- a/packages/icon-build-helpers/src/metadata/extension.js
+++ b/packages/icon-build-helpers/src/metadata/extension.js
@@ -61,7 +61,7 @@ function load(builderOrOptions = []) {
   const runOrder = [];
 
   function order(extension) {
-    const match = runOrder.find(entry => entry.name === extension.name);
+    const match = runOrder.find((entry) => entry.name === extension.name);
     if (match) {
       return;
     }
diff --git a/packages/icon-build-helpers/src/metadata/extensions/categories.js b/packages/icon-build-helpers/src/metadata/extensions/categories.js
index c494c239eba5..d8d4236dd1aa 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/categories.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/categories.js
@@ -37,9 +37,7 @@ const categories = () => {
             subcategories: Joi.array().items(
               Joi.object().keys({
                 name: Joi.string().required(),
-                members: Joi.array()
-                  .items(Joi.string())
-                  .required(),
+                members: Joi.array().items(Joi.string()).required(),
               })
             ),
           })
@@ -102,9 +100,9 @@ const categories = () => {
 
       // Verify that every asset in the registry has category information
       for (const icon of registry.values()) {
-        const match = members.find(member => member.name === icon.id);
+        const match = members.find((member) => member.name === icon.id);
         if (!match) {
-          const filepaths = icon.assets.map(asset => asset.filepath);
+          const filepaths = icon.assets.map((asset) => asset.filepath);
           throw new Error(
             `Expected the following icon to have category information: ` +
               `\`${icon.id}\`. This icon has assets in the following locations:\n` +
diff --git a/packages/icon-build-helpers/src/metadata/extensions/icons.js b/packages/icon-build-helpers/src/metadata/extensions/icons.js
index a6c0b8a5770f..7ceec89bb5ec 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/icons.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/icons.js
@@ -35,7 +35,7 @@ const icons = () => {
     ),
 
     extend(metadata, data, registry) {
-      metadata.icons = data.map(icon => {
+      metadata.icons = data.map((icon) => {
         return {
           name: icon.name,
           friendlyName: icon.friendly_name,
@@ -69,9 +69,11 @@ const icons = () => {
       // 2. No extra data are defined in the metadata that aren't in the source
       //    directory
       for (const item of registry.values()) {
-        const metadata = data.find(icon => icon.name === item.id);
+        const metadata = data.find((icon) => icon.name === item.id);
         if (!metadata) {
-          const filepaths = item.assets.map(asset => asset.filepath).join('\n');
+          const filepaths = item.assets
+            .map((asset) => asset.filepath)
+            .join('\n');
           throw new Error(
             `Expected the icon \`${item.id}\` to be defined in the data ` +
               `metadata file. Found matches for this asset in the following ` +
@@ -82,7 +84,7 @@ const icons = () => {
 
         // Verify that all the size information from the
         for (const size of metadata.sizes) {
-          const match = item.assets.find(asset => {
+          const match = item.assets.find((asset) => {
             if (size === 'glyph') {
               return asset.size === undefined;
             }
@@ -98,7 +100,7 @@ const icons = () => {
         }
 
         for (const asset of item.assets) {
-          const match = metadata.sizes.find(size => {
+          const match = metadata.sizes.find((size) => {
             if (asset.size === undefined) {
               return size === 'glyph';
             }
diff --git a/packages/icon-build-helpers/src/metadata/extensions/module-name.js b/packages/icon-build-helpers/src/metadata/extensions/module-name.js
index 7cc065df74e9..a634fc4ed167 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/module-name.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/module-name.js
@@ -30,7 +30,7 @@ const moduleName = () => {
  * @returns {string}
  */
 function getModuleName(name, parts = []) {
-  const namespace = parts.map(part => pascalCase(part)).join('');
+  const namespace = parts.map((part) => pascalCase(part)).join('');
   if (namespace !== '') {
     return `${namespace}${pascalCase(name)}`;
   }
diff --git a/packages/icon-build-helpers/src/metadata/extensions/output/__tests__/output-test.js b/packages/icon-build-helpers/src/metadata/extensions/output/__tests__/output-test.js
index 39633c200c7e..11c327d395e3 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/output/__tests__/output-test.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/output/__tests__/output-test.js
@@ -66,7 +66,7 @@ describe('output', () => {
 
     memory.filesystem.set(
       '/icons',
-      icons.map(icon => {
+      icons.map((icon) => {
         return {
           name: icon.name,
           friendly_name: icon.friendly_name,
@@ -87,7 +87,7 @@ describe('output', () => {
     });
 
     for (const icon of icons) {
-      const match = metadata.icons.find(entry => {
+      const match = metadata.icons.find((entry) => {
         return icon.name === entry.name;
       });
 
@@ -134,7 +134,7 @@ describe('output', () => {
 
     memory.filesystem.set(
       '/icons',
-      icons.map(icon => {
+      icons.map((icon) => {
         return {
           name: icon.name,
           friendly_name: icon.friendly_name,
@@ -155,7 +155,7 @@ describe('output', () => {
     });
 
     const [icon] = metadata.icons;
-    const bespoke = icon.output.find(output => {
+    const bespoke = icon.output.find((output) => {
       return output.descriptor.size === 16;
     });
     expect(bespoke.descriptor.attrs).toHaveProperty('data-test-id', 'test');
@@ -184,7 +184,7 @@ describe('output', () => {
 
     memory.filesystem.set(
       '/pictograms',
-      pictograms.map(pictogram => {
+      pictograms.map((pictogram) => {
         return {
           name: pictogram.name,
           friendly_name: pictogram.friendly_name,
@@ -208,7 +208,7 @@ describe('output', () => {
     });
 
     for (const pictogram of pictograms) {
-      const icon = metadata.icons.find(icon => {
+      const icon = metadata.icons.find((icon) => {
         return icon.name === pictogram.name;
       });
 
diff --git a/packages/icon-build-helpers/src/metadata/extensions/output/getModuleName.js b/packages/icon-build-helpers/src/metadata/extensions/output/getModuleName.js
index 0ad336d03293..8aaa07aaabfd 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/output/getModuleName.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/output/getModuleName.js
@@ -17,7 +17,7 @@ const { pascalCase } = require('change-case');
  */
 function getModuleName(name, size, namespace = []) {
   let moduleName = namespace
-    .filter(size => isNaN(size))
+    .filter((size) => isNaN(size))
     .map(pascalCase)
     .join('');
 
diff --git a/packages/icon-build-helpers/src/metadata/extensions/output/index.js b/packages/icon-build-helpers/src/metadata/extensions/output/index.js
index 4114083bbee6..a50d10e01936 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/output/index.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/output/index.js
@@ -62,11 +62,11 @@ const output = (options = defaultOptions) => {
         // If the target is not set to pictograms, then we're building up
         // metadata for icons
         const defaultAsset = icon.assets.find(
-          asset => asset.size === defaultSize
+          (asset) => asset.size === defaultSize
         );
         icon.output = await Promise.all(
-          sizes.map(async size => {
-            const asset = icon.assets.find(asset => asset.size === size);
+          sizes.map(async (size) => {
+            const asset = icon.assets.find((asset) => asset.size === size);
             const descriptor = asset
               ? await createDescriptor(icon.name, asset.optimized.data, size)
               : await createDescriptor(
@@ -90,9 +90,9 @@ const output = (options = defaultOptions) => {
         );
 
         // Handle glyph sizes that may not be one of our predetermined sizes
-        const hasGlyphAsset = icon.sizes.find(size => size === 'glyph');
+        const hasGlyphAsset = icon.sizes.find((size) => size === 'glyph');
         if (hasGlyphAsset) {
-          const asset = icon.assets.find(asset => !asset.size);
+          const asset = icon.assets.find((asset) => !asset.size);
           icon.output.push({
             descriptor: await createDescriptor(
               icon.name,
diff --git a/packages/icon-build-helpers/src/metadata/extensions/pictograms.js b/packages/icon-build-helpers/src/metadata/extensions/pictograms.js
index ef0cba15a824..035ebb386010 100644
--- a/packages/icon-build-helpers/src/metadata/extensions/pictograms.js
+++ b/packages/icon-build-helpers/src/metadata/extensions/pictograms.js
@@ -27,7 +27,7 @@ const pictograms = () => {
     ),
 
     extend(metadata, data, registry) {
-      metadata.icons = data.map(pictogram => {
+      metadata.icons = data.map((pictogram) => {
         return {
           name: pictogram.name,
           friendlyName: pictogram.friendly_name,
@@ -47,9 +47,11 @@ const pictograms = () => {
 
     validate(registry, data) {
       for (const item of registry.values()) {
-        const metadata = data.find(pictogram => pictogram.name === item.id);
+        const metadata = data.find((pictogram) => pictogram.name === item.id);
         if (!metadata) {
-          const filepaths = item.assets.map(asset => asset.filepath).join('\n');
+          const filepaths = item.assets
+            .map((asset) => asset.filepath)
+            .join('\n');
           throw new Error(
             `Expected the pictogram \`${item.id}\` to be defined in the data ` +
               `metadata file. Found matches for this asset in the following ` +
diff --git a/packages/icon-build-helpers/src/metadata/index.js b/packages/icon-build-helpers/src/metadata/index.js
index 5685dd35306f..4a3336f7077c 100644
--- a/packages/icon-build-helpers/src/metadata/index.js
+++ b/packages/icon-build-helpers/src/metadata/index.js
@@ -128,7 +128,7 @@ async function scaffold({
   );
 
   for (const item of registry.values()) {
-    const match = icons.data.find(icon => item.id === icon.name);
+    const match = icons.data.find((icon) => item.id === icon.name);
     if (!match) {
       const metadata = {
         name: item.id,
@@ -136,8 +136,8 @@ async function scaffold({
         aliases: [],
       };
       const sizes = item.assets
-        .map(asset => asset.size)
-        .filter(size => {
+        .map((asset) => asset.size)
+        .filter((size) => {
           return size !== undefined;
         });
 
diff --git a/packages/icon-build-helpers/src/metadata/migrations/2020-01-27.js b/packages/icon-build-helpers/src/metadata/migrations/2020-01-27.js
index 7fc382b3bc36..336bb8b55828 100644
--- a/packages/icon-build-helpers/src/metadata/migrations/2020-01-27.js
+++ b/packages/icon-build-helpers/src/metadata/migrations/2020-01-27.js
@@ -63,7 +63,7 @@ async function migrate() {
   );
 }
 
-migrate().catch(error => {
+migrate().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-remove-usage-fields.js b/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-remove-usage-fields.js
index 9dcebcd5bf96..2daaf0f34534 100644
--- a/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-remove-usage-fields.js
+++ b/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-remove-usage-fields.js
@@ -30,7 +30,7 @@ async function migrate() {
   );
 }
 
-migrate().catch(error => {
+migrate().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-update-pictogram-files.js b/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-update-pictogram-files.js
index f018d82ea950..6066307e4661 100644
--- a/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-update-pictogram-files.js
+++ b/packages/icon-build-helpers/src/metadata/migrations/2020-02-17-update-pictogram-files.js
@@ -64,7 +64,7 @@ async function migrate() {
   );
 }
 
-migrate().catch(error => {
+migrate().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/icon-build-helpers/src/metadata/storage.js b/packages/icon-build-helpers/src/metadata/storage.js
index 1389bc52a6cd..922a0cc94be3 100644
--- a/packages/icon-build-helpers/src/metadata/storage.js
+++ b/packages/icon-build-helpers/src/metadata/storage.js
@@ -17,7 +17,7 @@
  */
 function load(adapter, directory, extensions = []) {
   return Promise.all(
-    extensions.map(async extension => {
+    extensions.map(async (extension) => {
       // If computed, the extension has no file that has been persisted to disk
       // so we don't have to load it.
       if (extension.computed) {
@@ -43,7 +43,7 @@ function load(adapter, directory, extensions = []) {
  */
 function save(adapter, directory, extensions = []) {
   return Promise.all(
-    extensions.map(extension => {
+    extensions.map((extension) => {
       // If the extension is computed, there is nothing to persist to disk
       if (extension.computed) {
         return;
diff --git a/packages/icon-build-helpers/src/registry.js b/packages/icon-build-helpers/src/registry.js
index a4fcf35f421d..fb93af87d31b 100644
--- a/packages/icon-build-helpers/src/registry.js
+++ b/packages/icon-build-helpers/src/registry.js
@@ -68,7 +68,7 @@ async function create(directory) {
       .filter(Boolean);
 
     // Our namespace is generated from every directory that is not a size
-    const namespace = directories.filter(directory => isNaN(directory));
+    const namespace = directories.filter((directory) => isNaN(directory));
     const asset = {
       id: path.basename(filepath, '.svg'),
       filepath,
@@ -76,7 +76,7 @@ async function create(directory) {
     };
 
     // Our size folder is generated from the first directory that is a number
-    const sizeFolderName = directories.find(directory => !isNaN(directory));
+    const sizeFolderName = directories.find((directory) => !isNaN(directory));
     if (sizeFolderName) {
       asset.size = parseInt(sizeFolderName, 10);
     }
@@ -134,10 +134,10 @@ const denylist = new Set(['.DS_Store']);
 async function getFilepathsFromDirectory(directory) {
   const files = await fs.readdir(directory);
   return files
-    .filter(name => {
+    .filter((name) => {
       return !denylist.has(name);
     })
-    .map(filename => {
+    .map((filename) => {
       return path.join(directory, filename);
     });
 }
diff --git a/packages/icon-helpers/src/__tests__/getAttributes-test.js b/packages/icon-helpers/src/__tests__/getAttributes-test.js
index 83d2545f92d8..a88544ad8bc9 100644
--- a/packages/icon-helpers/src/__tests__/getAttributes-test.js
+++ b/packages/icon-helpers/src/__tests__/getAttributes-test.js
@@ -96,7 +96,7 @@ describe('getAttributes', () => {
 
   test.each(['aria-label', 'aria-labelledby', 'title'])(
     'should set role and remove aria-hidden if `%s` is set',
-    attr => {
+    (attr) => {
       const attrs = getAttributes({
         [attr]: 'attribute',
       });
diff --git a/packages/icon-helpers/src/toSVG.js b/packages/icon-helpers/src/toSVG.js
index 651580ccd0ea..6a00dde2b8cc 100644
--- a/packages/icon-helpers/src/toSVG.js
+++ b/packages/icon-helpers/src/toSVG.js
@@ -15,7 +15,7 @@ export default function toSVG(descriptor) {
   const node = document.createElementNS('http://www.w3.org/2000/svg', elem);
   const attributes = elem !== 'svg' ? attrs : getAttributes(attrs);
 
-  Object.keys(attributes).forEach(key => {
+  Object.keys(attributes).forEach((key) => {
     node.setAttribute(key, attrs[key]);
   });
 
diff --git a/packages/icons-react/tasks/build.js b/packages/icons-react/tasks/build.js
index 02f9add35d49..769c2f8a4893 100644
--- a/packages/icons-react/tasks/build.js
+++ b/packages/icons-react/tasks/build.js
@@ -16,7 +16,7 @@ async function build() {
   });
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/icons-vue/README.md b/packages/icons-vue/README.md
index 737e2ae20fa5..05e278ebeb9d 100644
--- a/packages/icons-vue/README.md
+++ b/packages/icons-vue/README.md
@@ -40,7 +40,7 @@ Vue.use(CarbonIconsVue, {
 });
 
 new Vue({
-  render: h => h(App),
+  render: (h) => h(App),
 }).$mount('#app');
 ```
 
diff --git a/packages/icons-vue/package.json b/packages/icons-vue/package.json
index ae4d1ce9e506..b4ef6d6928de 100644
--- a/packages/icons-vue/package.json
+++ b/packages/icons-vue/package.json
@@ -30,7 +30,7 @@
     "@carbon/cli-reporter": "^10.3.0",
     "@carbon/icons": "^10.11.0",
     "fs-extra": "^8.1.0",
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.5",
     "rimraf": "^3.0.0",
     "rollup": "^1.15.1",
     "vue": "^2.6.8"
diff --git a/packages/icons-vue/tasks/build.js b/packages/icons-vue/tasks/build.js
index 6ea0c447d891..38cbdbb2124d 100644
--- a/packages/icons-vue/tasks/build.js
+++ b/packages/icons-vue/tasks/build.js
@@ -16,7 +16,7 @@ async function build() {
   });
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/icons/tasks/build.js b/packages/icons/tasks/build.js
index 4f926ff2fb6a..d0e4713a37af 100644
--- a/packages/icons/tasks/build.js
+++ b/packages/icons/tasks/build.js
@@ -32,7 +32,7 @@ async function build() {
   ]);
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/icons/tasks/ci-check.js b/packages/icons/tasks/ci-check.js
index 259cfd66b9c2..3686abf90ca7 100644
--- a/packages/icons/tasks/ci-check.js
+++ b/packages/icons/tasks/ci-check.js
@@ -25,7 +25,7 @@ async function check() {
   });
 }
 
-check().catch(error => {
+check().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/icons/tasks/scaffold.js b/packages/icons/tasks/scaffold.js
index c08d921d24b7..28aeb822d23f 100644
--- a/packages/icons/tasks/scaffold.js
+++ b/packages/icons/tasks/scaffold.js
@@ -19,7 +19,7 @@ async function scaffold() {
   });
 }
 
-scaffold().catch(error => {
+scaffold().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/layout/src/__tests__/tokens-test.js b/packages/layout/src/__tests__/tokens-test.js
index 98518ae83fc2..1000c1a82f4c 100644
--- a/packages/layout/src/__tests__/tokens-test.js
+++ b/packages/layout/src/__tests__/tokens-test.js
@@ -11,7 +11,7 @@ import { unstable_tokens as tokens } from '../tokens';
 import * as Layout from '../';
 
 describe('@carbon/layout tokens', () => {
-  test.each(tokens)('%s should be exported', token => {
+  test.each(tokens)('%s should be exported', (token) => {
     expect(Layout[token]).toBeDefined();
   });
 });
diff --git a/packages/layout/tasks/build.js b/packages/layout/tasks/build.js
index b82149fc5bf0..f09adee7d432 100644
--- a/packages/layout/tasks/build.js
+++ b/packages/layout/tasks/build.js
@@ -167,7 +167,7 @@ function formatStep(name, index) {
   return `${name}-${step}`;
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/pictograms-react/tasks/build.js b/packages/pictograms-react/tasks/build.js
index f80e22a99f3b..58785a1cf165 100644
--- a/packages/pictograms-react/tasks/build.js
+++ b/packages/pictograms-react/tasks/build.js
@@ -16,7 +16,7 @@ async function build() {
   });
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/pictograms/tasks/build.js b/packages/pictograms/tasks/build.js
index e52b7a16b443..60f0f7f15b68 100644
--- a/packages/pictograms/tasks/build.js
+++ b/packages/pictograms/tasks/build.js
@@ -32,7 +32,7 @@ async function build() {
   ]);
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/pictograms/tasks/ci-check.js b/packages/pictograms/tasks/ci-check.js
index 091bd9433543..f55b1999f044 100644
--- a/packages/pictograms/tasks/ci-check.js
+++ b/packages/pictograms/tasks/ci-check.js
@@ -25,7 +25,7 @@ async function check() {
   });
 }
 
-check().catch(error => {
+check().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/pictograms/tasks/scaffold.js b/packages/pictograms/tasks/scaffold.js
index f76d2a8c6a90..f0f8990ceacb 100644
--- a/packages/pictograms/tasks/scaffold.js
+++ b/packages/pictograms/tasks/scaffold.js
@@ -20,7 +20,7 @@ async function scaffold() {
   });
 }
 
-scaffold().catch(error => {
+scaffold().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/prettier-config-carbon/package.json b/packages/prettier-config-carbon/package.json
index 8dd443a9f40b..87936e9b4b52 100644
--- a/packages/prettier-config-carbon/package.json
+++ b/packages/prettier-config-carbon/package.json
@@ -17,9 +17,9 @@
     "access": "public"
   },
   "peerDependencies": {
-    "prettier": "1.x || 2.x"
+    "prettier": "^2.0.5"
   },
   "devDependencies": {
-    "prettier": "^1.19.1"
+    "prettier": "^2.0.5"
   }
 }
diff --git a/packages/react-hooks/.storybook/config.js b/packages/react-hooks/.storybook/config.js
index b95837b24f3e..e2249c4e91ce 100644
--- a/packages/react-hooks/.storybook/config.js
+++ b/packages/react-hooks/.storybook/config.js
@@ -11,7 +11,7 @@ import { configure } from '@storybook/react';
 // automatically import all files ending in *.stories.js
 const req = require.context('../src', true, /-story\.js$/);
 function loadStories() {
-  req.keys().forEach(filename => req(filename));
+  req.keys().forEach((filename) => req(filename));
 }
 
 configure(loadStories, module);
diff --git a/packages/react-hooks/src/__tests__/useId-test.js b/packages/react-hooks/src/__tests__/useId-test.js
index 0ad998728c82..916caf95a660 100644
--- a/packages/react-hooks/src/__tests__/useId-test.js
+++ b/packages/react-hooks/src/__tests__/useId-test.js
@@ -38,7 +38,7 @@ describe('useId', () => {
       </>
     );
 
-    const ids = Array.from(container.childNodes).map(node => node.id);
+    const ids = Array.from(container.childNodes).map((node) => node.id);
     const uniqueIds = new Set(ids);
     expect(uniqueIds.size).toBe(2);
   });
diff --git a/packages/react-hooks/src/useAnnouncer.js b/packages/react-hooks/src/useAnnouncer.js
index 6f6a1b46f94d..e43ddbf88d65 100644
--- a/packages/react-hooks/src/useAnnouncer.js
+++ b/packages/react-hooks/src/useAnnouncer.js
@@ -87,7 +87,7 @@ export function useAnnouncer() {
  */
 export function useAssertiveAnnouncer() {
   const announce = useAnnouncer();
-  return message => announce('assertive', message);
+  return (message) => announce('assertive', message);
 }
 
 /**
@@ -96,5 +96,5 @@ export function useAssertiveAnnouncer() {
  */
 export function usePoliteAnnouncer() {
   const announce = useAnnouncer();
-  return message => announce('polite', message);
+  return (message) => announce('polite', message);
 }
diff --git a/packages/react-hooks/src/useDebounce-story.js b/packages/react-hooks/src/useDebounce-story.js
index fb428af57657..359b5944dbea 100644
--- a/packages/react-hooks/src/useDebounce-story.js
+++ b/packages/react-hooks/src/useDebounce-story.js
@@ -14,7 +14,7 @@ function useTimedUpdate(interval, { maxValue = 10 } = {}) {
 
   useEffect(() => {
     function handler() {
-      updateValue(value => {
+      updateValue((value) => {
         if (value + 1 > maxValue) {
           window.clearInterval(timerId);
           return value;
diff --git a/packages/react/.storybook/.babelrc.js b/packages/react/.storybook/.babelrc.js
index a3eee148a0ea..8c95840078f8 100644
--- a/packages/react/.storybook/.babelrc.js
+++ b/packages/react/.storybook/.babelrc.js
@@ -12,7 +12,7 @@ const packageJson = require('../package.json');
 
 const root = path.resolve(__dirname, '../');
 const babelConfig = Object.keys(packageJson.babel).reduce((acc, key) => {
-  const options = packageJson.babel[key].map(option => {
+  const options = packageJson.babel[key].map((option) => {
     // If the preset/plugin is not a relative path, we can use it directly
     if (option[0] !== '.') {
       return option;
diff --git a/packages/react/.storybook/addon-carbon-theme/components/Panel.js b/packages/react/.storybook/addon-carbon-theme/components/Panel.js
index c5b01119effc..e89db7932508 100644
--- a/packages/react/.storybook/addon-carbon-theme/components/Panel.js
+++ b/packages/react/.storybook/addon-carbon-theme/components/Panel.js
@@ -42,7 +42,7 @@ const typeTokenDefaults = {
 export const CarbonThemesPanel = ({ api, active }) => {
   const [currentTheme, setCurrentTheme] = useState('white');
   const handleChange = useCallback(
-    event => {
+    (event) => {
       const { value } = event.target;
       setCurrentTheme(value);
       api.getChannel().emit(CARBON_CURRENT_THEME, value);
@@ -97,7 +97,7 @@ CarbonThemesPanel.propTypes = {
 export const CarbonTypePanel = ({ api, active }) => {
   const [currentTypeTokens, setCurrentTypeTokens] = useState(typeTokenDefaults);
   const handleTokenChange = useCallback(
-    event => {
+    (event) => {
       const { name: tokenName, value: tokenValue } = event.target;
       setCurrentTypeTokens({ ...currentTypeTokens, [tokenName]: tokenValue });
       api.getChannel().emit(CARBON_TYPE_TOKEN, { tokenName, tokenValue });
@@ -107,14 +107,14 @@ export const CarbonTypePanel = ({ api, active }) => {
   return (
     active && (
       <Form>
-        {Object.keys(typeTokenDefaults).map(tokenName => (
+        {Object.keys(typeTokenDefaults).map((tokenName) => (
           <Form.Field key={tokenName} label={`${tokenName}:`}>
             <Form.Select
               name={tokenName}
               onChange={handleTokenChange}
               size="flex"
               value={currentTypeTokens[tokenName]}>
-              {typeTokenPairings.map(tokenValue => {
+              {typeTokenPairings.map((tokenValue) => {
                 const [fontSize, lineHeight] = tokenValue.split('-');
                 return (
                   <option key={tokenValue} value={tokenValue}>
diff --git a/packages/react/.storybook/addon-carbon-theme/register.js b/packages/react/.storybook/addon-carbon-theme/register.js
index 0c3623c07e29..b32c0b36821c 100644
--- a/packages/react/.storybook/addon-carbon-theme/register.js
+++ b/packages/react/.storybook/addon-carbon-theme/register.js
@@ -16,7 +16,7 @@ import {
 } from './shared';
 
 if (process.env.CARBON_REACT_STORYBOOK_USE_CUSTOM_PROPERTIES === 'true') {
-  addons.register(CARBON_THEMES_ADDON_ID, api => {
+  addons.register(CARBON_THEMES_ADDON_ID, (api) => {
     addons.addPanel(CARBON_THEME_PANEL_ID, {
       title: 'Carbon theme',
       render: ({ active, key }) => (
@@ -25,7 +25,7 @@ if (process.env.CARBON_REACT_STORYBOOK_USE_CUSTOM_PROPERTIES === 'true') {
     });
   });
 
-  addons.register(CARBON_TYPE_ADDON_ID, api => {
+  addons.register(CARBON_TYPE_ADDON_ID, (api) => {
     addons.addPanel(CARBON_TYPE_PANEL_ID, {
       title: 'Carbon type',
       render: ({ active, key }) => (
diff --git a/packages/react/.storybook/config.js b/packages/react/.storybook/config.js
index fceac525af0a..120d27a754a3 100644
--- a/packages/react/.storybook/config.js
+++ b/packages/react/.storybook/config.js
@@ -48,19 +48,20 @@ configureActions({
   limit: 10,
 });
 
-addDecorator(story => <Container story={story} />);
+addDecorator((story) => <Container story={story} />);
 // addDecorator(checkA11y);
 
-addons.getChannel().on(CARBON_CURRENT_THEME, theme => {
+addons.getChannel().on(CARBON_CURRENT_THEME, (theme) => {
   document.documentElement.setAttribute('storybook-carbon-theme', theme);
 });
 
 addons.getChannel().on(CARBON_TYPE_TOKEN, ({ tokenName, tokenValue }) => {
   const root = document.documentElement;
   const [fontSize, lineHeight] = tokenValue.split('-');
-  const rem = px =>
-    `${px /
-      parseFloat(getComputedStyle(document.documentElement).fontSize)}rem`;
+  const rem = (px) =>
+    `${
+      px / parseFloat(getComputedStyle(document.documentElement).fontSize)
+    }rem`;
   root.style.setProperty(
     `--${customPropertyPrefix}-${tokenName}-font-size`,
     rem(fontSize)
diff --git a/packages/react/.storybook/polyfills/element-matches.js b/packages/react/.storybook/polyfills/element-matches.js
index 0fdc8d8c2e54..3aa9c50e6373 100644
--- a/packages/react/.storybook/polyfills/element-matches.js
+++ b/packages/react/.storybook/polyfills/element-matches.js
@@ -9,7 +9,7 @@ const matchesFuncName = [
   'matches',
   'webkitMatchesSelector',
   'msMatchesSelector',
-].filter(name => typeof Element.prototype[name] === 'function')[0];
+].filter((name) => typeof Element.prototype[name] === 'function')[0];
 
 if (matchesFuncName !== 'matches') {
   Element.prototype.matches = Element.prototype[matchesFuncName];
diff --git a/packages/react/.storybook/webpack.config.js b/packages/react/.storybook/webpack.config.js
index dc999f4d8422..630c1217f05e 100644
--- a/packages/react/.storybook/webpack.config.js
+++ b/packages/react/.storybook/webpack.config.js
@@ -66,7 +66,7 @@ module.exports = ({ config, mode }) => {
     test: /(\/|\\)FeatureFlags\.js$/,
     loader: 'string-replace-loader',
     options: {
-      multiple: Object.keys(replaceTable).map(key => ({
+      multiple: Object.keys(replaceTable).map((key) => ({
         search: `export\\s+const\\s+${key}\\s*=\\s*false`,
         replace: `export const ${key} = ${replaceTable[key]}`,
         flags: 'i',
diff --git a/packages/react/__tests__/PublicAPI-test.js b/packages/react/__tests__/PublicAPI-test.js
index 8a003393a8c7..69dda479e5db 100644
--- a/packages/react/__tests__/PublicAPI-test.js
+++ b/packages/react/__tests__/PublicAPI-test.js
@@ -94,7 +94,7 @@ beforeEach(() => {
     // prop-type. We'll also need to define the `isRequired` field similar to
     // how we used it in the primitive prop types
     for (const type of complex) {
-      PropTypes[type] = function(...args) {
+      PropTypes[type] = function (...args) {
         const value = {
           type,
           args,
@@ -127,7 +127,7 @@ test('Public API should only change with a semver change', () => {
   const CarbonReact = require('../src');
   const PublicAPI = new Map();
 
-  Object.keys(CarbonReact).forEach(name => {
+  Object.keys(CarbonReact).forEach((name) => {
     const Component = CarbonReact[name];
     PublicAPI.set(name, mapComponentToAPI(Component));
   });
@@ -135,7 +135,7 @@ test('Public API should only change with a semver change', () => {
   function mapComponentToAPI(Component) {
     const api = {};
 
-    Object.keys(Component).forEach(key => {
+    Object.keys(Component).forEach((key) => {
       // There are a couple of properties on components that we don't believe
       // are part of our API, such as `_` prefixed variables, or capture details
       // that are internal to a library-specific piece of functionality. For
diff --git a/packages/react/rollup.config.js b/packages/react/rollup.config.js
index cd0721feae3b..bd841c7bb67f 100644
--- a/packages/react/rollup.config.js
+++ b/packages/react/rollup.config.js
@@ -69,7 +69,7 @@ const baseConfig = {
 
 const umdExternalDependencies = Object.keys(
   packageJson.peerDependencies
-).filter(dependency => dependency !== 'carbon-components');
+).filter((dependency) => dependency !== 'carbon-components');
 
 const umdBundleConfig = {
   input: baseConfig.input,
diff --git a/packages/react/src/components/Accordion/AccordionItem.js b/packages/react/src/components/Accordion/AccordionItem.js
index 8d7086dd8125..c0ab02650a17 100644
--- a/packages/react/src/components/Accordion/AccordionItem.js
+++ b/packages/react/src/components/Accordion/AccordionItem.js
@@ -15,7 +15,7 @@ import { useId } from '../../internal/useId';
 import deprecate from '../../prop-types/deprecate.js';
 
 const { prefix } = settings;
-const defaultRenderExpando = props => <button {...props} />;
+const defaultRenderExpando = (props) => <button {...props} />;
 
 function AccordionItem({
   children,
diff --git a/packages/react/src/components/Button/Button.js b/packages/react/src/components/Button/Button.js
index b41876adca62..33c3ebb0e69e 100644
--- a/packages/react/src/components/Button/Button.js
+++ b/packages/react/src/components/Button/Button.js
@@ -172,7 +172,7 @@ Button.propTypes = {
    * If specifying the `renderIcon` prop, provide a description for that icon that can
    * be read by screen readers
    */
-  iconDescription: props => {
+  iconDescription: (props) => {
     if (props.renderIcon && !props.children && !props.iconDescription) {
       return new Error(
         'renderIcon property specified without also providing an iconDescription property.'
diff --git a/packages/react/src/components/Checkbox/Checkbox.js b/packages/react/src/components/Checkbox/Checkbox.js
index a5fec39efab5..a76e13c43fff 100644
--- a/packages/react/src/components/Checkbox/Checkbox.js
+++ b/packages/react/src/components/Checkbox/Checkbox.js
@@ -41,12 +41,12 @@ const Checkbox = React.forwardRef(function Checkbox(
       <input
         {...other}
         type="checkbox"
-        onChange={evt => {
+        onChange={(evt) => {
           onChange(evt.target.checked, id, evt);
         }}
         className={`${prefix}--checkbox`}
         id={id}
-        ref={el => {
+        ref={(el) => {
           if (el) {
             el.indeterminate = indeterminate;
           }
diff --git a/packages/react/src/components/CodeSnippet/__tests__/CodeSnippet.Skeleton-test.js b/packages/react/src/components/CodeSnippet/__tests__/CodeSnippet.Skeleton-test.js
index 6ae560a76e7c..20038e7feb33 100644
--- a/packages/react/src/components/CodeSnippet/__tests__/CodeSnippet.Skeleton-test.js
+++ b/packages/react/src/components/CodeSnippet/__tests__/CodeSnippet.Skeleton-test.js
@@ -19,7 +19,7 @@ describe('CodeSnippetSkeleton', () => {
   describe('automated accessibility testing', () => {
     it.each(snippetTypes)(
       'should have no Axe violations with type="%s"',
-      async type => {
+      async (type) => {
         const { container } = render(<CodeSnippetSkeleton type={type} />);
         await expect(container).toHaveNoAxeViolations();
       }
@@ -27,7 +27,7 @@ describe('CodeSnippetSkeleton', () => {
 
     it.each(snippetTypes)(
       'should have no DAP violations with type="%s"',
-      async type => {
+      async (type) => {
         const { container } = render(<CodeSnippetSkeleton type={type} />);
         await expect(container).toHaveNoDAPViolations(
           `CodeSnippetSkeleton-${type}`
diff --git a/packages/react/src/components/ComboBox/ComboBox-story.js b/packages/react/src/components/ComboBox/ComboBox-story.js
index 10343c71d4f0..68796357b252 100644
--- a/packages/react/src/components/ComboBox/ComboBox-story.js
+++ b/packages/react/src/components/ComboBox/ComboBox-story.js
@@ -69,7 +69,7 @@ storiesOf('ComboBox', module)
       <div style={{ width: 300 }}>
         <ComboBox
           items={items}
-          itemToString={item => (item ? item.text : '')}
+          itemToString={(item) => (item ? item.text : '')}
           {...props()}
         />
       </div>
diff --git a/packages/react/src/components/ComboBox/ComboBox-test.js b/packages/react/src/components/ComboBox/ComboBox-test.js
index 183567bc583b..ff2139c7debd 100644
--- a/packages/react/src/components/ComboBox/ComboBox-test.js
+++ b/packages/react/src/components/ComboBox/ComboBox-test.js
@@ -22,11 +22,11 @@ import { settings } from 'carbon-components';
 
 const { prefix } = settings;
 
-const findInputNode = wrapper => wrapper.find(`.${prefix}--text-input`);
+const findInputNode = (wrapper) => wrapper.find(`.${prefix}--text-input`);
 const downshiftActions = {
   setHighlightedIndex: jest.fn(),
 };
-const clearInput = wrapper =>
+const clearInput = (wrapper) =>
   wrapper.instance().handleOnStateChange({ inputValue: '' }, downshiftActions);
 
 describe('ComboBox', () => {
@@ -88,7 +88,7 @@ describe('ComboBox', () => {
   it('should render custom item components', () => {
     const wrapper = mount(<ComboBox {...mockProps} />);
     wrapper.setProps({
-      itemToElement: item => <div className="mock-item">{item.text}</div>,
+      itemToElement: (item) => <div className="mock-item">{item.text}</div>,
     });
     openMenu(wrapper);
 
diff --git a/packages/react/src/components/ComboBox/ComboBox.js b/packages/react/src/components/ComboBox/ComboBox.js
index 9ff70d6c68e5..2d1c22883d28 100644
--- a/packages/react/src/components/ComboBox/ComboBox.js
+++ b/packages/react/src/components/ComboBox/ComboBox.js
@@ -17,7 +17,7 @@ import setupGetInstanceId from '../../tools/setupGetInstanceId';
 
 const { prefix } = settings;
 
-const defaultItemToString = item => {
+const defaultItemToString = (item) => {
   if (typeof item === 'string') {
     return item;
   }
@@ -219,7 +219,7 @@ export default class ComboBox extends React.Component {
   }
 
   filterItems = (items, itemToString, inputValue) =>
-    items.filter(item =>
+    items.filter((item) =>
       this.props.shouldFilterItem({
         item,
         itemToString,
@@ -227,13 +227,13 @@ export default class ComboBox extends React.Component {
       })
     );
 
-  handleOnChange = selectedItem => {
+  handleOnChange = (selectedItem) => {
     if (this.props.onChange) {
       this.props.onChange({ selectedItem });
     }
   };
 
-  handleOnInputValueChange = inputValue => {
+  handleOnInputValueChange = (inputValue) => {
     const { onInputChange } = this.props;
 
     this.setState(
@@ -262,7 +262,7 @@ export default class ComboBox extends React.Component {
     }
   };
 
-  onToggleClick = isOpen => event => {
+  onToggleClick = (isOpen) => (event) => {
     if (event.target === this.textInput.current && isOpen) {
       event.preventDownshiftDefault = true;
       event.persist();
@@ -370,7 +370,7 @@ export default class ComboBox extends React.Component {
                   {...getInputProps({
                     disabled,
                     placeholder,
-                    onKeyDown: event => {
+                    onKeyDown: (event) => {
                       if (match(event, keys.Space)) {
                         event.stopPropagation();
                       }
diff --git a/packages/react/src/components/ComboBox/tools/filter.js b/packages/react/src/components/ComboBox/tools/filter.js
index 0c33b9e8c557..cb9903f2ee91 100644
--- a/packages/react/src/components/ComboBox/tools/filter.js
+++ b/packages/react/src/components/ComboBox/tools/filter.js
@@ -6,11 +6,9 @@
  */
 
 export const defaultFilterItems = (items, { itemToString, inputValue }) =>
-  items.filter(item => {
+  items.filter((item) => {
     if (!inputValue) {
       return true;
     }
-    return itemToString(item)
-      .toLowerCase()
-      .includes(inputValue.toLowerCase());
+    return itemToString(item).toLowerCase().includes(inputValue.toLowerCase());
   });
diff --git a/packages/react/src/components/ComposedModal/ComposedModal-story.js b/packages/react/src/components/ComposedModal/ComposedModal-story.js
index 25e8d0434e30..b9619bc20e6f 100644
--- a/packages/react/src/components/ComposedModal/ComposedModal-story.js
+++ b/packages/react/src/components/ComposedModal/ComposedModal-story.js
@@ -230,7 +230,7 @@ storiesOf('ComposedModal', module)
     () => {
       class ComposedModalExample extends React.Component {
         state = { open: false };
-        toggleModal = open => this.setState({ open });
+        toggleModal = (open) => this.setState({ open });
         render() {
           const { open } = this.state;
           const { size, ...rest } = props.composedModal();
diff --git a/packages/react/src/components/ComposedModal/ComposedModal.js b/packages/react/src/components/ComposedModal/ComposedModal.js
index f3b9b2b97432..4e95b678e347 100644
--- a/packages/react/src/components/ComposedModal/ComposedModal.js
+++ b/packages/react/src/components/ComposedModal/ComposedModal.js
@@ -81,7 +81,7 @@ export default class ComposedModal extends Component {
         };
   }
 
-  handleKeyDown = evt => {
+  handleKeyDown = (evt) => {
     // Esc key
     if (evt.which === 27) {
       this.closeModal(evt);
@@ -90,7 +90,7 @@ export default class ComposedModal extends Component {
     this.props.onKeyDown(evt);
   };
 
-  handleClick = evt => {
+  handleClick = (evt) => {
     if (
       this.innerModal.current &&
       !this.innerModal.current.contains(evt.target)
@@ -132,7 +132,7 @@ export default class ComposedModal extends Component {
     );
   }
 
-  focusButton = focusContainerElement => {
+  focusButton = (focusContainerElement) => {
     if (focusContainerElement) {
       const primaryFocusElement = focusContainerElement.querySelector(
         this.props.selectorPrimaryFocus
@@ -165,7 +165,7 @@ export default class ComposedModal extends Component {
     }
   }
 
-  handleTransitionEnd = evt => {
+  handleTransitionEnd = (evt) => {
     if (
       this.outerModal.current.offsetWidth &&
       this.outerModal.current.offsetHeight &&
@@ -176,7 +176,7 @@ export default class ComposedModal extends Component {
     }
   };
 
-  closeModal = evt => {
+  closeModal = (evt) => {
     const { onClose } = this.props;
     if (!onClose || onClose(evt) !== false) {
       this.setState({
@@ -210,7 +210,7 @@ export default class ComposedModal extends Component {
       [containerClassName]: containerClassName,
     });
 
-    const childrenWithProps = React.Children.toArray(children).map(child => {
+    const childrenWithProps = React.Children.toArray(children).map((child) => {
       switch (child.type) {
         case React.createElement(ModalHeader).type:
           return React.cloneElement(child, {
@@ -325,7 +325,7 @@ export class ModalHeader extends Component {
     buttonOnClick: () => {},
   };
 
-  handleCloseButtonClick = evt => {
+  handleCloseButtonClick = (evt) => {
     this.props.closeModal(evt);
     this.props.buttonOnClick();
   };
@@ -508,7 +508,7 @@ export class ModalFooter extends Component {
     onRequestSubmit: () => {},
   };
 
-  handleRequestClose = evt => {
+  handleRequestClose = (evt) => {
     this.props.closeModal(evt);
     this.props.onRequestClose(evt);
   };
diff --git a/packages/react/src/components/ContentSwitcher/ContentSwitcher-test.js b/packages/react/src/components/ContentSwitcher/ContentSwitcher-test.js
index 824ecced3565..d0d652cd9218 100644
--- a/packages/react/src/components/ContentSwitcher/ContentSwitcher-test.js
+++ b/packages/react/src/components/ContentSwitcher/ContentSwitcher-test.js
@@ -72,10 +72,7 @@ describe('ContentSwitcher', () => {
     it('should avoid change the selected index upon setting props, unless there the value actually changes', () => {
       wrapper.setProps({ selectedIndex: 1 });
       // Turns `state.selectedIndex` to `0`
-      children
-        .first()
-        .props()
-        .onClick(mockData);
+      children.first().props().onClick(mockData);
       wrapper.setProps({ selectedIndex: 1 }); // No change in `selectedIndex` prop
       const clonedChildren = wrapper.find(Switch);
       expect(clonedChildren.first().props().selected).toEqual(true);
@@ -84,10 +81,7 @@ describe('ContentSwitcher', () => {
 
     it('should change the selected index upon change in props', () => {
       wrapper.setProps({ selectedIndex: 0 });
-      children
-        .first()
-        .props()
-        .onClick(mockData);
+      children.first().props().onClick(mockData);
       wrapper.setProps({ selectedIndex: 1 });
       const clonedChildren = wrapper.find(Switch);
       expect(clonedChildren.first().props().selected).toEqual(false);
@@ -110,10 +104,7 @@ describe('ContentSwitcher', () => {
 
     const children = wrapper.find(Switch);
 
-    children
-      .first()
-      .props()
-      .onClick(mockData);
+    children.first().props().onClick(mockData);
 
     it('should invoke onChange', () => {
       expect(onChange).toBeCalledWith(mockData);
@@ -147,10 +138,7 @@ describe('ContentSwitcher', () => {
 
     const children = wrapper.find(Switch);
 
-    children
-      .first()
-      .props()
-      .onKeyDown(mockData);
+    children.first().props().onKeyDown(mockData);
 
     it('should invoke onChange', () => {
       expect(onChange).toBeCalledWith(mockData);
diff --git a/packages/react/src/components/ContentSwitcher/ContentSwitcher.js b/packages/react/src/components/ContentSwitcher/ContentSwitcher.js
index 83ade3af3930..38749a3f4e1a 100644
--- a/packages/react/src/components/ContentSwitcher/ContentSwitcher.js
+++ b/packages/react/src/components/ContentSwitcher/ContentSwitcher.js
@@ -67,11 +67,11 @@ export default class ContentSwitcher extends React.Component {
         };
   }
 
-  handleItemRef = index => ref => {
+  handleItemRef = (index) => (ref) => {
     this._switchRefs[index] = ref;
   };
 
-  handleChildChange = data => {
+  handleChildChange = (data) => {
     const { selectionMode } = this.props;
     // the currently selected child index
     const { selectedIndex } = this.state;
diff --git a/packages/react/src/components/Copy/Copy.js b/packages/react/src/components/Copy/Copy.js
index 3741bdc91fe5..9c1ef3534b42 100644
--- a/packages/react/src/components/Copy/Copy.js
+++ b/packages/react/src/components/Copy/Copy.js
@@ -38,7 +38,7 @@ export default function Copy({
     setAnimation('fade-in');
     handleFadeOut();
   }, [handleFadeOut]);
-  const handleAnimationEnd = event => {
+  const handleAnimationEnd = (event) => {
     if (event.animationName === 'hide-feedback') {
       setAnimation('');
     }
diff --git a/packages/react/src/components/DangerButton/DangerButton.js b/packages/react/src/components/DangerButton/DangerButton.js
index afc311ab0605..65b8f0932e34 100644
--- a/packages/react/src/components/DangerButton/DangerButton.js
+++ b/packages/react/src/components/DangerButton/DangerButton.js
@@ -8,6 +8,6 @@
 import React from 'react';
 import Button from '../Button';
 
-const DangerButton = props => <Button kind="danger" {...props} />;
+const DangerButton = (props) => <Button kind="danger" {...props} />;
 
 export default DangerButton;
diff --git a/packages/react/src/components/DataTable/DataTable.js b/packages/react/src/components/DataTable/DataTable.js
index fe4cfcaeab70..99ef5a2b7b9c 100644
--- a/packages/react/src/components/DataTable/DataTable.js
+++ b/packages/react/src/components/DataTable/DataTable.js
@@ -40,7 +40,7 @@ const defaultTranslations = {
   [translationKeys.unselectRow]: 'Unselect row',
 };
 
-const translateWithId = id => defaultTranslations[id];
+const translateWithId = (id) => defaultTranslations[id];
 
 /**
  * Data Tables are used to represent a collection of resources, displaying a
@@ -153,24 +153,24 @@ export default class DataTable extends React.Component {
   }
 
   UNSAFE_componentWillReceiveProps(nextProps) {
-    const rowIds = this.props.rows.map(row => row.id);
-    const nextRowIds = nextProps.rows.map(row => row.id);
+    const rowIds = this.props.rows.map((row) => row.id);
+    const nextRowIds = nextProps.rows.map((row) => row.id);
 
     if (!isEqual(rowIds, nextRowIds)) {
-      this.setState(state => getDerivedStateFromProps(nextProps, state));
+      this.setState((state) => getDerivedStateFromProps(nextProps, state));
       return;
     }
 
-    const headers = this.props.headers.map(header => header.key);
-    const nextHeaders = nextProps.headers.map(header => header.key);
+    const headers = this.props.headers.map((header) => header.key);
+    const nextHeaders = nextProps.headers.map((header) => header.key);
 
     if (!isEqual(headers, nextHeaders)) {
-      this.setState(state => getDerivedStateFromProps(nextProps, state));
+      this.setState((state) => getDerivedStateFromProps(nextProps, state));
       return;
     }
 
     if (!isEqual(this.props.rows, nextProps.rows)) {
-      this.setState(state => getDerivedStateFromProps(nextProps, state));
+      this.setState((state) => getDerivedStateFromProps(nextProps, state));
       return;
     }
   }
@@ -222,7 +222,7 @@ export default class DataTable extends React.Component {
     const { translateWithId: t } = this.props;
     const { isExpandedAll, rowIds, rowsById } = this.state;
     const isExpanded =
-      isExpandedAll || rowIds.every(id => rowsById[id].isExpanded);
+      isExpandedAll || rowIds.every((id) => rowsById[id].isExpanded);
     const translationKey = !isExpanded
       ? translationKeys.collapseAll
       : translationKeys.expandAll;
@@ -249,7 +249,7 @@ export default class DataTable extends React.Component {
    * @returns {Function}
    */
   handleOnHeaderClick = (onClick, sortParams) => {
-    return e => onClick(e, sortParams);
+    return (e) => onClick(e, sortParams);
   };
 
   /**
@@ -260,7 +260,7 @@ export default class DataTable extends React.Component {
    * @returns {Function}
    */
   handleOnExpandHeaderClick = (onClick, expandParams) => {
-    return e => onClick(e, expandParams);
+    return (e) => onClick(e, expandParams);
   };
 
   /**
@@ -400,7 +400,7 @@ export default class DataTable extends React.Component {
    * @returns {Array<string>} the array of rowIds that are currently selected
    */
   getSelectedRows = () =>
-    this.state.rowIds.filter(id => {
+    this.state.rowIds.filter((id) => {
       const row = this.state.rowsById[id];
       return row.isSelected && !row.disabled;
     });
@@ -462,7 +462,7 @@ export default class DataTable extends React.Component {
    * deselect all selected rows
    */
   handleOnCancel = () => {
-    this.setState(state => {
+    this.setState((state) => {
       return {
         shouldShowBatchActions: false,
         ...this.setAllSelectedState(state, false, this.getFilteredRowIds()),
@@ -474,11 +474,11 @@ export default class DataTable extends React.Component {
    * Handler for toggling the selection state of all rows in the database
    */
   handleSelectAll = () => {
-    this.setState(state => {
+    this.setState((state) => {
       const filteredRowIds = this.getFilteredRowIds();
       const { rowsById } = state;
       const isSelected = !(
-        Object.values(rowsById).filter(row => row.isSelected && !row.disabled)
+        Object.values(rowsById).filter((row) => row.isSelected && !row.disabled)
           .length > 0
       );
       return {
@@ -494,8 +494,8 @@ export default class DataTable extends React.Component {
    * @param {string} rowId
    * @returns {Function}
    */
-  handleOnSelectRow = rowId => () => {
-    this.setState(state => {
+  handleOnSelectRow = (rowId) => () => {
+    this.setState((state) => {
       const row = state.rowsById[rowId];
       if (this.props.radio) {
         // deselect all radio buttons
@@ -517,7 +517,7 @@ export default class DataTable extends React.Component {
         };
       }
       const selectedRows = state.rowIds.filter(
-        id => state.rowsById[id].isSelected
+        (id) => state.rowsById[id].isSelected
       ).length;
       // Predict the length of the selected rows after this change occurs
       const selectedRowsCount = !row.isSelected
@@ -546,8 +546,8 @@ export default class DataTable extends React.Component {
    * @param {string} rowId
    * @returns {Function}
    */
-  handleOnExpandRow = rowId => () => {
-    this.setState(state => {
+  handleOnExpandRow = (rowId) => () => {
+    this.setState((state) => {
       const row = state.rowsById[rowId];
       const { isExpandedAll } = state;
       return {
@@ -567,7 +567,7 @@ export default class DataTable extends React.Component {
    * Handler for changing the expansion state of all rows.
    */
   handleOnExpandAll = () => {
-    this.setState(state => {
+    this.setState((state) => {
       const { rowIds, isExpandedAll } = state;
       return {
         isExpandedAll: !isExpandedAll,
@@ -591,8 +591,8 @@ export default class DataTable extends React.Component {
    * @param {string} headerKey the field for the header that we are sorting by
    * @returns {Function}
    */
-  handleSortBy = headerKey => () => {
-    this.setState(state =>
+  handleSortBy = (headerKey) => () => {
+    this.setState((state) =>
       getNextSortState(this.props, state, { key: headerKey })
     );
   };
@@ -645,10 +645,10 @@ export default class DataTable extends React.Component {
       onInputChange: this.handleOnInputValueChange,
 
       // Expose internal state change actions
-      sortBy: headerKey => this.handleSortBy(headerKey)(),
+      sortBy: (headerKey) => this.handleSortBy(headerKey)(),
       selectAll: this.handleSelectAll,
-      selectRow: rowId => this.handleOnSelectRow(rowId)(),
-      expandRow: rowId => this.handleOnExpandRow(rowId)(),
+      selectRow: (rowId) => this.handleOnSelectRow(rowId)(),
+      expandRow: (rowId) => this.handleOnExpandRow(rowId)(),
       expandAll: this.handleOnExpandAll,
       radio: this.props.radio,
     };
diff --git a/packages/react/src/components/DataTable/README.md b/packages/react/src/components/DataTable/README.md
index 6e39b2b0085c..4e6e4b47bc9b 100644
--- a/packages/react/src/components/DataTable/README.md
+++ b/packages/react/src/components/DataTable/README.md
@@ -103,7 +103,7 @@ function App() {
           <Table>
             <TableHead>
               <TableRow>
-                {headers.map(header => (
+                {headers.map((header) => (
                   <TableHeader {...getHeaderProps({ header })}>
                     {header.header}
                   </TableHeader>
@@ -111,9 +111,9 @@ function App() {
               </TableRow>
             </TableHead>
             <TableBody>
-              {rows.map(row => (
+              {rows.map((row) => (
                 <TableRow key={row.id}>
-                  {row.cells.map(cell => (
+                  {row.cells.map((cell) => (
                     <TableCell key={cell.id}>{cell.value}</TableCell>
                   ))}
                 </TableRow>
@@ -289,7 +289,7 @@ const renderProp = ({ rows, headers, getHeaderProps }) => (
     <Table>
       <TableHead>
         <TableRow>
-          {headers.map(header => (
+          {headers.map((header) => (
             <TableHeader {...getHeaderProps({ header })}>
               {header.header}
             </TableHeader>
@@ -297,9 +297,9 @@ const renderProp = ({ rows, headers, getHeaderProps }) => (
         </TableRow>
       </TableHead>
       <TableBody>
-        {rows.map(row => (
+        {rows.map((row) => (
           <TableRow key={row.id}>
-            {row.cells.map(cell => (
+            {row.cells.map((cell) => (
               <TableCell key={cell.id}>{cell.value}</TableCell>
             ))}
           </TableRow>
@@ -396,7 +396,7 @@ following:
       <Table>
         <TableHead>
           <TableRow>
-            {headers.map(header => (
+            {headers.map((header) => (
               <TableHeader {...getHeaderProps({ header })}>
                 {header.header}
               </TableHeader>
@@ -404,9 +404,9 @@ following:
           </TableRow>
         </TableHead>
         <TableBody>
-          {rows.map(row => (
+          {rows.map((row) => (
             <TableRow key={row.id}>
-              {row.cells.map(cell => (
+              {row.cells.map((cell) => (
                 <TableCell key={cell.id}>{cell.value}</TableCell>
               ))}
             </TableRow>
@@ -636,7 +636,7 @@ In practice, this looks like the following:
       <Table>
         <TableHead>
           <TableRow>
-            {headers.map(header => (
+            {headers.map((header) => (
               <TableHeader {...getHeaderProps({ header })}>
                 {header.header}
               </TableHeader>
@@ -644,9 +644,9 @@ In practice, this looks like the following:
           </TableRow>
         </TableHead>
         <TableBody>
-          {rows.map(row => (
+          {rows.map((row) => (
             <TableRow key={row.id}>
-              {row.cells.map(cell => (
+              {row.cells.map((cell) => (
                 <TableCell key={cell.id}>{cell.value}</TableCell>
               ))}
             </TableRow>
diff --git a/packages/react/src/components/DataTable/TableBatchAction.js b/packages/react/src/components/DataTable/TableBatchAction.js
index 9fbb06ed21bb..b443adacf28b 100644
--- a/packages/react/src/components/DataTable/TableBatchAction.js
+++ b/packages/react/src/components/DataTable/TableBatchAction.js
@@ -10,7 +10,7 @@ import React from 'react';
 import { AddFilled16 as iconAddSolid } from '@carbon/icons-react';
 import Button from '../Button';
 
-const TableBatchAction = props => <Button {...props} />;
+const TableBatchAction = (props) => <Button {...props} />;
 
 TableBatchAction.propTypes = {
   /**
@@ -22,7 +22,7 @@ TableBatchAction.propTypes = {
    * If specifying the `renderIcon` prop, provide a description for that icon that can
    * be read by screen readers
    */
-  iconDescription: props => {
+  iconDescription: (props) => {
     if (props.renderIcon && !props.children && !props.iconDescription) {
       return new Error(
         'renderIcon property specified without also providing an iconDescription property.'
diff --git a/packages/react/src/components/DataTable/TableExpandedRow.js b/packages/react/src/components/DataTable/TableExpandedRow.js
index 8f22a19118c0..1ef775df0c8a 100644
--- a/packages/react/src/components/DataTable/TableExpandedRow.js
+++ b/packages/react/src/components/DataTable/TableExpandedRow.js
@@ -22,7 +22,7 @@ const TableExpandedRow = ({
   const rowRef = useRef(null);
   const className = cx(`${prefix}--expandable-row`, customClassName);
 
-  const toggleParentHoverClass = eventType => {
+  const toggleParentHoverClass = (eventType) => {
     if (rowRef && rowRef.current && rowRef.current.previousElementSibling) {
       const parentNode = rowRef.current.previousElementSibling;
       if (eventType === 'enter') {
diff --git a/packages/react/src/components/DataTable/TableRow.js b/packages/react/src/components/DataTable/TableRow.js
index 844983379c6d..925709a05234 100644
--- a/packages/react/src/components/DataTable/TableRow.js
+++ b/packages/react/src/components/DataTable/TableRow.js
@@ -13,7 +13,7 @@ import { settings } from 'carbon-components';
 
 const { prefix } = settings;
 
-const TableRow = props => {
+const TableRow = (props) => {
   // Remove unnecessary props if provided to this component, these are
   // only useful in `TableExpandRow`
   const className = cx(props.className, {
diff --git a/packages/react/src/components/DataTable/TableToolbarSearch.js b/packages/react/src/components/DataTable/TableToolbarSearch.js
index 7de5b5e7da1f..6dc775556670 100644
--- a/packages/react/src/components/DataTable/TableToolbarSearch.js
+++ b/packages/react/src/components/DataTable/TableToolbarSearch.js
@@ -19,7 +19,7 @@ const translationKeys = {
   'carbon.table.toolbar.search.label': 'Filter table',
   'carbon.table.toolbar.search.placeholder': 'Filter table',
 };
-const translateWithId = id => {
+const translateWithId = (id) => {
   return translationKeys[id];
 };
 const TableToolbarSearch = ({
@@ -89,11 +89,11 @@ const TableToolbarSearch = ({
     }
   };
 
-  const onClick = e => {
+  const onClick = (e) => {
     handleExpand(e, true);
   };
 
-  const onChange = e => {
+  const onChange = (e) => {
     setValue(e.target.value);
     if (onChangeProp) {
       onChangeProp(e);
@@ -104,9 +104,9 @@ const TableToolbarSearch = ({
     <div
       tabIndex={expandedState ? '-1' : tabIndex}
       ref={searchRef}
-      onClick={event => onClick(event)}
-      onFocus={event => handleExpand(event, true)}
-      onBlur={event => !value && handleExpand(event, false)}
+      onClick={(event) => onClick(event)}
+      onFocus={(event) => handleExpand(event, true)}
+      onBlur={(event) => !value && handleExpand(event, false)}
       className={searchContainerClasses}>
       <Search
         size="sm"
diff --git a/packages/react/src/components/DataTable/__tests__/DataTable-test.js b/packages/react/src/components/DataTable/__tests__/DataTable-test.js
index 324f55ec14cc..743e0cb2ad1d 100644
--- a/packages/react/src/components/DataTable/__tests__/DataTable-test.js
+++ b/packages/react/src/components/DataTable/__tests__/DataTable-test.js
@@ -35,11 +35,11 @@ import { mount } from 'enzyme';
 const getHeaderAt = (wrapper, index) =>
   wrapper.find('TableHeader button').at(index);
 const getRowAt = (wrapper, index) => wrapper.find('tbody tr').at(index);
-const getFilterInput = wrapper =>
+const getFilterInput = (wrapper) =>
   wrapper.find('TableToolbarSearch Search input');
-const getSelectAll = wrapper =>
+const getSelectAll = (wrapper) =>
   wrapper.find('TableSelectAll input[type="checkbox"]');
-const getLastCallFor = mocker =>
+const getLastCallFor = (mocker) =>
   mocker.mock.calls[mocker.mock.calls.length - 1];
 const getInputAtIndex = ({ wrapper, index, inputType }) =>
   getRowAt(wrapper, index).find(`input[type="${inputType}"]`);
@@ -121,7 +121,7 @@ describe('DataTable', () => {
             <Table {...getTableProps()}>
               <TableHead>
                 <TableRow>
-                  {headers.map(header => (
+                  {headers.map((header) => (
                     <TableHeader {...getHeaderProps({ header })}>
                       {header.header}
                     </TableHeader>
@@ -129,9 +129,9 @@ describe('DataTable', () => {
                 </TableRow>
               </TableHead>
               <TableBody>
-                {rows.map(row => (
+                {rows.map((row) => (
                   <TableRow key={row.id}>
-                    {row.cells.map(cell => (
+                    {row.cells.map((cell) => (
                       <TableCell key={cell.id}>{cell.value}</TableCell>
                     ))}
                   </TableRow>
@@ -254,7 +254,7 @@ describe('DataTable', () => {
                 <TableHead>
                   <TableRow>
                     <TableSelectAll {...getSelectionProps()} />
-                    {headers.map(header => (
+                    {headers.map((header) => (
                       <TableHeader {...getHeaderProps({ header })}>
                         {header.header}
                       </TableHeader>
@@ -262,10 +262,10 @@ describe('DataTable', () => {
                   </TableRow>
                 </TableHead>
                 <TableBody>
-                  {rows.map(row => (
+                  {rows.map((row) => (
                     <TableRow key={row.id}>
                       <TableSelectRow {...getSelectionProps({ row })} />
-                      {row.cells.map(cell => (
+                      {row.cells.map((cell) => (
                         <TableCell key={cell.id}>{cell.value}</TableCell>
                       ))}
                     </TableRow>
@@ -409,7 +409,7 @@ describe('DataTable', () => {
                 <TableHead>
                   <TableRow>
                     <TableSelectAll {...getSelectionProps()} />
-                    {headers.map(header => (
+                    {headers.map((header) => (
                       <TableHeader {...getHeaderProps({ header })}>
                         {header.header}
                       </TableHeader>
@@ -417,10 +417,10 @@ describe('DataTable', () => {
                   </TableRow>
                 </TableHead>
                 <TableBody>
-                  {rows.map(row => (
+                  {rows.map((row) => (
                     <TableRow key={row.id}>
                       <TableSelectRow {...getSelectionProps({ row })} />
-                      {row.cells.map(cell => (
+                      {row.cells.map((cell) => (
                         <TableCell key={cell.id}>{cell.value}</TableCell>
                       ))}
                     </TableRow>
@@ -465,7 +465,7 @@ describe('DataTable', () => {
       const wrapper = mount(<DataTable {...mockProps} />);
 
       const nextRows = [
-        ...mockProps.rows.map(row => ({ ...row })),
+        ...mockProps.rows.map((row) => ({ ...row })),
         {
           id: 'd',
           fieldA: 'Field 3:A',
@@ -493,7 +493,7 @@ describe('DataTable', () => {
       const wrapper = mount(<DataTable {...mockProps} />);
 
       const nextRows = [
-        ...mockProps.rows.map(row => ({ ...row, disabled: true })),
+        ...mockProps.rows.map((row) => ({ ...row, disabled: true })),
       ];
 
       wrapper.setProps({ rows: nextRows });
@@ -555,7 +555,7 @@ describe('DataTable', () => {
               <Table>
                 <TableHead>
                   <TableRow>
-                    {headers.map(header => (
+                    {headers.map((header) => (
                       <TableHeader {...getHeaderProps({ header })}>
                         {header.header}
                       </TableHeader>
@@ -563,10 +563,10 @@ describe('DataTable', () => {
                   </TableRow>
                 </TableHead>
                 <TableBody>
-                  {rows.map(row => (
+                  {rows.map((row) => (
                     <TableRow key={row.id}>
                       <TableSelectRow {...getSelectionProps({ row })} />
-                      {row.cells.map(cell => (
+                      {row.cells.map((cell) => (
                         <TableCell key={cell.id}>{cell.value}</TableCell>
                       ))}
                     </TableRow>
@@ -707,7 +707,7 @@ describe('DataTable', () => {
                   <TableRow>
                     <TableExpandHeader {...getExpandHeaderProps()} />
                     <TableSelectAll {...getSelectionProps()} />
-                    {headers.map(header => (
+                    {headers.map((header) => (
                       <TableHeader {...getHeaderProps({ header })}>
                         {header.header}
                       </TableHeader>
@@ -715,11 +715,11 @@ describe('DataTable', () => {
                   </TableRow>
                 </TableHead>
                 <TableBody>
-                  {rows.map(row => (
+                  {rows.map((row) => (
                     <React.Fragment key={row.id}>
                       <TableExpandRow {...getRowProps({ row })}>
                         <TableSelectRow {...getSelectionProps({ row })} />
-                        {row.cells.map(cell => (
+                        {row.cells.map((cell) => (
                           <TableCell key={cell.id}>{cell.value}</TableCell>
                         ))}
                       </TableExpandRow>
@@ -758,7 +758,7 @@ describe('DataTable', () => {
 
       const nextArgs = mockProps.render.mock.calls[1][0];
       expect(nextArgs.rows.length).toBe(nextRows.length);
-      expect(nextArgs.rows.map(row => row.id)).toEqual(['b', 'a', 'c', 'd']);
+      expect(nextArgs.rows.map((row) => row.id)).toEqual(['b', 'a', 'c', 'd']);
     });
 
     it('should add additional headers when receiving new props', () => {
@@ -768,7 +768,7 @@ describe('DataTable', () => {
       expect(args.headers).toEqual(mockProps.headers);
 
       const nextProps = {
-        rows: mockProps.rows.map(row => ({
+        rows: mockProps.rows.map((row) => ({
           ...row,
           fieldC: 'Field X:C',
         })),
@@ -792,7 +792,7 @@ describe('DataTable', () => {
       getSelectAll(wrapper).simulate('click');
 
       const nextRows = [
-        ...mockProps.rows.map(row => ({ ...row, isSelected: true })),
+        ...mockProps.rows.map((row) => ({ ...row, isSelected: true })),
         {
           id: 'd',
           fieldA: 'Field 4:A',
@@ -844,7 +844,7 @@ describe('DataTable', () => {
       wrapper.setProps({ rows: nextRows });
 
       const nextArgs = mockProps.render.mock.calls[1][0];
-      expect(nextArgs.rows.map(row => row.id)).toEqual(['c', 'a', 'b']);
+      expect(nextArgs.rows.map((row) => row.id)).toEqual(['c', 'a', 'b']);
     });
 
     it('should update cells when receiving new props', () => {
@@ -853,7 +853,7 @@ describe('DataTable', () => {
 
       expect(args.rows.length).toEqual(mockProps.rows.length);
 
-      const nextRows = mockProps.rows.map(row => {
+      const nextRows = mockProps.rows.map((row) => {
         return {
           ...row,
           fieldA: row.fieldA + '!',
@@ -863,7 +863,7 @@ describe('DataTable', () => {
       wrapper.setProps({ rows: nextRows });
 
       const nextArgs = mockProps.render.mock.calls[1][0];
-      expect(nextArgs.rows.map(row => row.cells[0].value)).toEqual([
+      expect(nextArgs.rows.map((row) => row.cells[0].value)).toEqual([
         'Field 2:A!',
         'Field 1:A!',
         'Field 3:A!',
diff --git a/packages/react/src/components/DataTable/__tests__/TableBatchAction-test.js b/packages/react/src/components/DataTable/__tests__/TableBatchAction-test.js
index 79bf7c9ff602..007b0d9be0bc 100644
--- a/packages/react/src/components/DataTable/__tests__/TableBatchAction-test.js
+++ b/packages/react/src/components/DataTable/__tests__/TableBatchAction-test.js
@@ -18,7 +18,7 @@ describe('DataTable.TableBatchAction', () => {
   });
 
   it('should support rendering a custom icon', () => {
-    const renderIcon = jest.fn(props => (
+    const renderIcon = jest.fn((props) => (
       <svg {...props}>
         <circle cx="16" cy="16" r="8" />
       </svg>
diff --git a/packages/react/src/components/DataTable/__tests__/TableExpandRow-test.js b/packages/react/src/components/DataTable/__tests__/TableExpandRow-test.js
index 224f43560dcd..9580e9f5891b 100644
--- a/packages/react/src/components/DataTable/__tests__/TableExpandRow-test.js
+++ b/packages/react/src/components/DataTable/__tests__/TableExpandRow-test.js
@@ -43,18 +43,12 @@ describe('DataTable.TableExpandRow', () => {
       </Table>
     );
     expect(
-      Object.keys(
-        wrapper
-          .find('TableCell')
-          .first()
-          .props()
-      ).indexOf('data-previous-value') !== -1
+      Object.keys(wrapper.find('TableCell').first().props()).indexOf(
+        'data-previous-value'
+      ) !== -1
     ).toBe(true);
     expect(
-      wrapper
-        .find('TableCell')
-        .first()
-        .prop('data-previous-value')
+      wrapper.find('TableCell').first().prop('data-previous-value')
     ).not.toBeDefined();
   });
 
@@ -79,10 +73,7 @@ describe('DataTable.TableExpandRow', () => {
       </Table>
     );
     expect(
-      expandedWrapper
-        .find('TableCell')
-        .first()
-        .prop('data-previous-value')
+      expandedWrapper.find('TableCell').first().prop('data-previous-value')
     ).toBe('collapsed');
   });
 });
diff --git a/packages/react/src/components/DataTable/__tests__/exports-test.js b/packages/react/src/components/DataTable/__tests__/exports-test.js
index 525055ab8d82..195f03563037 100644
--- a/packages/react/src/components/DataTable/__tests__/exports-test.js
+++ b/packages/react/src/components/DataTable/__tests__/exports-test.js
@@ -25,8 +25,8 @@ const blacklist = new Set([
 ]);
 const components = fs
   .readdirSync(COMPONENT_PATH)
-  .filter(name => !blacklist.has(name))
-  .map(name => path.basename(name, '.js'));
+  .filter((name) => !blacklist.has(name))
+  .map((name) => path.basename(name, '.js'));
 
 describe('DataTable exports', () => {
   it('should export DataTable by default', () => {
@@ -34,7 +34,7 @@ describe('DataTable exports', () => {
     expect(DataTable.default.name).toBe('DataTable');
   });
 
-  components.forEach(component => {
+  components.forEach((component) => {
     it(`should have a named export for Component: ${component}`, () => {
       expect(DataTable[component]).toBeDefined();
       expect(DataTable.default[component]).toBeDefined();
diff --git a/packages/react/src/components/DataTable/stories/default.js b/packages/react/src/components/DataTable/stories/default.js
index 22b4bdc20821..c12fce771248 100644
--- a/packages/react/src/components/DataTable/stories/default.js
+++ b/packages/react/src/components/DataTable/stories/default.js
@@ -18,7 +18,7 @@ import DataTable, {
 } from '../../DataTable';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -38,7 +38,7 @@ export default props => (
         <Table {...getTableProps()}>
           <TableHead>
             <TableRow>
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -46,9 +46,9 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
               </TableRow>
diff --git a/packages/react/src/components/DataTable/stories/shared.js b/packages/react/src/components/DataTable/stories/shared.js
index 12c37ee4ae0b..a5d04a9ad761 100644
--- a/packages/react/src/components/DataTable/stories/shared.js
+++ b/packages/react/src/components/DataTable/stories/shared.js
@@ -91,5 +91,5 @@ export const headers = [
   },
 ];
 
-export const batchActionClick = selectedRows => () =>
+export const batchActionClick = (selectedRows) => () =>
   action('batch action click')(selectedRows);
diff --git a/packages/react/src/components/DataTable/stories/with-batch-actions.js b/packages/react/src/components/DataTable/stories/with-batch-actions.js
index 5c80d35e0fb3..2aad064732f7 100644
--- a/packages/react/src/components/DataTable/stories/with-batch-actions.js
+++ b/packages/react/src/components/DataTable/stories/with-batch-actions.js
@@ -35,7 +35,7 @@ import DataTable, {
 
 import { batchActionClick, initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -108,7 +108,7 @@ export default props => (
           <TableHead>
             <TableRow>
               <TableSelectAll {...getSelectionProps()} />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -116,10 +116,10 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
                 <TableSelectRow {...getSelectionProps({ row })} />
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
               </TableRow>
diff --git a/packages/react/src/components/DataTable/stories/with-batch-expansion.js b/packages/react/src/components/DataTable/stories/with-batch-expansion.js
index a98f4c6e5ae6..d5fa0226e574 100644
--- a/packages/react/src/components/DataTable/stories/with-batch-expansion.js
+++ b/packages/react/src/components/DataTable/stories/with-batch-expansion.js
@@ -20,7 +20,7 @@ import DataTable, {
 } from '../../DataTable';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -45,7 +45,7 @@ export default props => (
                 enableExpando={true}
                 {...getExpandHeaderProps()}
               />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -53,10 +53,10 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <React.Fragment key={row.id}>
                 <TableExpandRow {...getRowProps({ row })}>
-                  {row.cells.map(cell => (
+                  {row.cells.map((cell) => (
                     <TableCell key={cell.id}>{cell.value}</TableCell>
                   ))}
                 </TableExpandRow>
diff --git a/packages/react/src/components/DataTable/stories/with-boolean-column.js b/packages/react/src/components/DataTable/stories/with-boolean-column.js
index 87fe45805f3f..f90bc40e3846 100644
--- a/packages/react/src/components/DataTable/stories/with-boolean-column.js
+++ b/packages/react/src/components/DataTable/stories/with-boolean-column.js
@@ -82,7 +82,7 @@ export const headers = [
   },
 ];
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -102,7 +102,7 @@ export default props => (
         <Table {...getTableProps()}>
           <TableHead>
             <TableRow>
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -110,9 +110,9 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
-                {row.cells.map(cell => {
+                {row.cells.map((cell) => {
                   if (cell.info.header === 'enabled') {
                     return (
                       <TableCell
diff --git a/packages/react/src/components/DataTable/stories/with-dynamic-content.js b/packages/react/src/components/DataTable/stories/with-dynamic-content.js
index a102e258df00..6a32c153ba78 100644
--- a/packages/react/src/components/DataTable/stories/with-dynamic-content.js
+++ b/packages/react/src/components/DataTable/stories/with-dynamic-content.js
@@ -35,7 +35,7 @@ import DataTable, {
 } from '../../DataTable';
 import { batchActionClick, initialRows, headers } from './shared';
 
-export default props => {
+export default (props) => {
   const insertInRandomPosition = (array, element) => {
     const index = Math.floor(Math.random() * (array.length + 1));
     return [...array.slice(0, index), element, ...array.slice(index)];
@@ -55,8 +55,8 @@ export default props => {
         header: `Header ${length}`,
       };
 
-      this.setState(state => {
-        const rows = state.rows.map(row => {
+      this.setState((state) => {
+        const rows = state.rows.map((row) => {
           return {
             ...row,
             [header.key]: header.header,
@@ -70,7 +70,7 @@ export default props => {
     };
 
     handleOnRowAdd = () => {
-      this.setState(state => {
+      this.setState((state) => {
         const { id: _id, rows } = state;
         const id = _id + 1;
         const row = {
@@ -84,8 +84,8 @@ export default props => {
         };
 
         state.headers
-          .filter(header => row[header.key] === undefined)
-          .forEach(header => {
+          .filter((header) => row[header.key] === undefined)
+          .forEach((header) => {
             row[header.key] = header.header;
           });
 
@@ -159,7 +159,7 @@ export default props => {
                   <TableRow>
                     <TableExpandHeader />
                     <TableSelectAll {...getSelectionProps()} />
-                    {headers.map(header => (
+                    {headers.map((header) => (
                       <TableHeader {...getHeaderProps({ header })}>
                         {header.header}
                       </TableHeader>
@@ -167,11 +167,11 @@ export default props => {
                   </TableRow>
                 </TableHead>
                 <TableBody>
-                  {rows.map(row => (
+                  {rows.map((row) => (
                     <React.Fragment key={row.id}>
                       <TableExpandRow {...getRowProps({ row })}>
                         <TableSelectRow {...getSelectionProps({ row })} />
-                        {row.cells.map(cell => (
+                        {row.cells.map((cell) => (
                           <TableCell key={cell.id}>{cell.value}</TableCell>
                         ))}
                       </TableExpandRow>
diff --git a/packages/react/src/components/DataTable/stories/with-expansion.js b/packages/react/src/components/DataTable/stories/with-expansion.js
index b7542f36ef46..5631f1c546b8 100644
--- a/packages/react/src/components/DataTable/stories/with-expansion.js
+++ b/packages/react/src/components/DataTable/stories/with-expansion.js
@@ -22,7 +22,7 @@ import DataTable, {
 } from '../../DataTable';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -43,7 +43,7 @@ export default props => (
           <TableHead>
             <TableRow>
               <TableExpandHeader />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -51,10 +51,10 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <React.Fragment key={row.id}>
                 <TableExpandRow {...getRowProps({ row })}>
-                  {row.cells.map(cell => (
+                  {row.cells.map((cell) => (
                     <TableCell key={cell.id}>{cell.value}</TableCell>
                   ))}
                 </TableExpandRow>
diff --git a/packages/react/src/components/DataTable/stories/with-options.js b/packages/react/src/components/DataTable/stories/with-options.js
index 34c1a43f77ff..84b17b931d40 100644
--- a/packages/react/src/components/DataTable/stories/with-options.js
+++ b/packages/react/src/components/DataTable/stories/with-options.js
@@ -22,7 +22,7 @@ import DataTable, {
 } from '..';
 import { headers, initialRows } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={[
       { ...initialRows[0], disabled: true },
@@ -49,7 +49,7 @@ export default props => (
             <TableRow>
               <TableExpandHeader />
               <TableSelectAll {...getSelectionProps()} />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -57,11 +57,11 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <React.Fragment key={row.id}>
                 <TableExpandRow {...getRowProps({ row })}>
                   <TableSelectRow {...getSelectionProps({ row })} />
-                  {row.cells.map(cell => (
+                  {row.cells.map((cell) => (
                     <TableCell key={cell.id}>{cell.value}</TableCell>
                   ))}
                 </TableExpandRow>
diff --git a/packages/react/src/components/DataTable/stories/with-overflow-menu.js b/packages/react/src/components/DataTable/stories/with-overflow-menu.js
index c28837decf9a..e0b61f4c3205 100644
--- a/packages/react/src/components/DataTable/stories/with-overflow-menu.js
+++ b/packages/react/src/components/DataTable/stories/with-overflow-menu.js
@@ -20,7 +20,7 @@ import DataTable, {
 } from '../../DataTable';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -38,7 +38,7 @@ export default props => (
           <TableHead>
             <TableRow>
               <TableSelectAll {...getSelectionProps()} />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -47,10 +47,10 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
                 <TableSelectRow {...getSelectionProps({ row })} />
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
                 <TableCell className="bx--table-column-menu">
diff --git a/packages/react/src/components/DataTable/stories/with-selection--radio.js b/packages/react/src/components/DataTable/stories/with-selection--radio.js
index 10c3792946b6..c27b6433f8f8 100644
--- a/packages/react/src/components/DataTable/stories/with-selection--radio.js
+++ b/packages/react/src/components/DataTable/stories/with-selection--radio.js
@@ -18,7 +18,7 @@ import DataTable, {
 } from '..';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -41,7 +41,7 @@ export default props => (
           <TableHead>
             <TableRow>
               <th scope="col" />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -49,10 +49,10 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
                 <TableSelectRow {...getSelectionProps({ row })} />
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
               </TableRow>
diff --git a/packages/react/src/components/DataTable/stories/with-selection.js b/packages/react/src/components/DataTable/stories/with-selection.js
index 5499ba753e58..447b0ff7d577 100644
--- a/packages/react/src/components/DataTable/stories/with-selection.js
+++ b/packages/react/src/components/DataTable/stories/with-selection.js
@@ -19,7 +19,7 @@ import DataTable, {
 } from '../../DataTable';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -41,7 +41,7 @@ export default props => (
           <TableHead>
             <TableRow>
               <TableSelectAll {...getSelectionProps()} />
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -49,10 +49,10 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
                 <TableSelectRow {...getSelectionProps({ row })} />
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
               </TableRow>
diff --git a/packages/react/src/components/DataTable/stories/with-sorting.js b/packages/react/src/components/DataTable/stories/with-sorting.js
index ffd26402cc8b..666a0597d836 100644
--- a/packages/react/src/components/DataTable/stories/with-sorting.js
+++ b/packages/react/src/components/DataTable/stories/with-sorting.js
@@ -17,7 +17,7 @@ import DataTable, {
 } from '../../DataTable';
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -38,7 +38,7 @@ export default props => (
         <Table {...getTableProps()}>
           <TableHead>
             <TableRow>
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header, isSortable: true })}>
                   {header.header}
                 </TableHeader>
@@ -46,9 +46,9 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
               </TableRow>
diff --git a/packages/react/src/components/DataTable/stories/with-toolbar.js b/packages/react/src/components/DataTable/stories/with-toolbar.js
index 9c438c85e6ef..6bb56986ab78 100644
--- a/packages/react/src/components/DataTable/stories/with-toolbar.js
+++ b/packages/react/src/components/DataTable/stories/with-toolbar.js
@@ -25,7 +25,7 @@ import DataTable, {
 
 import { initialRows, headers } from './shared';
 
-export default props => (
+export default (props) => (
   <DataTable
     rows={initialRows}
     headers={headers}
@@ -66,7 +66,7 @@ export default props => (
         <Table {...getTableProps()}>
           <TableHead>
             <TableRow>
-              {headers.map(header => (
+              {headers.map((header) => (
                 <TableHeader {...getHeaderProps({ header })}>
                   {header.header}
                 </TableHeader>
@@ -74,9 +74,9 @@ export default props => (
             </TableRow>
           </TableHead>
           <TableBody>
-            {rows.map(row => (
+            {rows.map((row) => (
               <TableRow {...getRowProps({ row })}>
-                {row.cells.map(cell => (
+                {row.cells.map((cell) => (
                   <TableCell key={cell.id}>{cell.value}</TableCell>
                 ))}
               </TableRow>
diff --git a/packages/react/src/components/DataTable/tools/denormalize.js b/packages/react/src/components/DataTable/tools/denormalize.js
index ed61b3c7d363..0faf31d764c7 100644
--- a/packages/react/src/components/DataTable/tools/denormalize.js
+++ b/packages/react/src/components/DataTable/tools/denormalize.js
@@ -20,9 +20,9 @@
  * @param {object} cellsById object containing lookups for cells by id
  */
 const denormalize = (rowIds, rowsById, cellsById) => {
-  return rowIds.map(id => ({
+  return rowIds.map((id) => ({
     ...rowsById[id],
-    cells: rowsById[id].cells.map(cellId => cellsById[cellId]),
+    cells: rowsById[id].cells.map((cellId) => cellsById[cellId]),
   }));
 };
 
diff --git a/packages/react/src/components/DataTable/tools/filter.js b/packages/react/src/components/DataTable/tools/filter.js
index 3253c26c91a7..32baaac93754 100644
--- a/packages/react/src/components/DataTable/tools/filter.js
+++ b/packages/react/src/components/DataTable/tools/filter.js
@@ -21,7 +21,7 @@ import { getCellId } from './cells';
  * @returns {Array<string>} rowIds
  */
 export const defaultFilterRows = ({ rowIds, headers, cellsById, inputValue }) =>
-  rowIds.filter(rowId =>
+  rowIds.filter((rowId) =>
     headers.some(({ key }) => {
       const id = getCellId(rowId, key);
       if (typeof cellsById[id].value === 'boolean') return false;
diff --git a/packages/react/src/components/DataTableSkeleton/DataTableSkeleton.js b/packages/react/src/components/DataTableSkeleton/DataTableSkeleton.js
index 8e309d8adbba..c16ee148a895 100644
--- a/packages/react/src/components/DataTableSkeleton/DataTableSkeleton.js
+++ b/packages/react/src/components/DataTableSkeleton/DataTableSkeleton.js
@@ -35,7 +35,7 @@ const DataTableSkeleton = ({
   for (let i = 0; i < rowRepeat; i++) {
     rows[i] = (
       <tr key={i}>
-        {columnsArray.map(j => (
+        {columnsArray.map((j) => (
           <td key={j}>
             <span />
           </td>
@@ -65,7 +65,7 @@ const DataTableSkeleton = ({
       <table className={dataTableSkeletonClasses} {...rest}>
         <thead>
           <tr>
-            {columnsArray.map(i => (
+            {columnsArray.map((i) => (
               <th key={i}>
                 <span></span>
               </th>
diff --git a/packages/react/src/components/DatePicker/DatePicker-story.js b/packages/react/src/components/DatePicker/DatePicker-story.js
index 17634194a4d0..3d951d3f096a 100644
--- a/packages/react/src/components/DatePicker/DatePicker-story.js
+++ b/packages/react/src/components/DatePicker/DatePicker-story.js
@@ -18,7 +18,7 @@ import WithState from '../../tools/withState';
 // Datepickers last argument contains an instance of flatpickr
 // and will cause action logger to enter an infinite loop. Just don't log that argument
 const datePickerOnChangeActions = decorateAction([
-  args => args.slice(0, args.length - 2),
+  (args) => args.slice(0, args.length - 2),
 ]);
 
 const patterns = {
@@ -185,7 +185,7 @@ storiesOf('DatePicker', module)
               datePickerType="single"
               dateFormat="m/d/Y"
               value={state.date}
-              onChange={eventOrDates => {
+              onChange={(eventOrDates) => {
                 const value = eventOrDates.target
                   ? eventOrDates.target.value
                   : eventOrDates[0];
diff --git a/packages/react/src/components/DatePicker/DatePicker-test.js b/packages/react/src/components/DatePicker/DatePicker-test.js
index 98ca63dbc574..a8f46bf14457 100644
--- a/packages/react/src/components/DatePicker/DatePicker-test.js
+++ b/packages/react/src/components/DatePicker/DatePicker-test.js
@@ -282,9 +282,9 @@ describe('DatePicker', () => {
 
   describe('Date picker can be used with enzyme shallow', () => {
     let spy;
-    beforeEach(done => {
+    beforeEach((done) => {
       spy = {};
-      spy.console = jest.spyOn(console, 'error').mockImplementation(e => {
+      spy.console = jest.spyOn(console, 'error').mockImplementation((e) => {
         done(e);
       });
       done();
diff --git a/packages/react/src/components/DatePicker/DatePicker.js b/packages/react/src/components/DatePicker/DatePicker.js
index 8fede680460b..730fa0693420 100644
--- a/packages/react/src/components/DatePicker/DatePicker.js
+++ b/packages/react/src/components/DatePicker/DatePicker.js
@@ -49,12 +49,12 @@ const monthToStr = (monthNumber, shorthand, locale) =>
  * @param {string} config.classFlatpickrCurrentMonth The CSS class for the text-based month selection UI.
  * @returns {Plugin} A Flatpickr plugin to use text instead of `<select>` for month picker.
  */
-const carbonFlatpickrMonthSelectPlugin = config => fp => {
+const carbonFlatpickrMonthSelectPlugin = (config) => (fp) => {
   const setupElements = () => {
     if (!fp.monthElements) {
       return;
     }
-    fp.monthElements.forEach(elem => {
+    fp.monthElements.forEach((elem) => {
       if (!elem.parentNode) return;
       elem.parentNode.removeChild(elem);
     });
@@ -89,13 +89,13 @@ const carbonFlatpickrMonthSelectPlugin = config => fp => {
       config.shorthand === true,
       fp.l10n
     );
-    fp.yearElements.forEach(elem => {
+    fp.yearElements.forEach((elem) => {
       const currentMonthContainer = elem.closest(
         config.selectorFlatpickrMonthYearContainer
       );
       Array.prototype.forEach.call(
         currentMonthContainer.querySelectorAll('.cur-month'),
-        monthElement => {
+        (monthElement) => {
           monthElement.textContent = monthStr;
         }
       );
@@ -419,7 +419,7 @@ export default class DatePicker extends Component {
     }
   }
 
-  onChange = e => {
+  onChange = (e) => {
     if (
       e.target.value === '' &&
       this.cal &&
@@ -429,9 +429,9 @@ export default class DatePicker extends Component {
     }
   };
 
-  addKeyboardEvents = cal => {
+  addKeyboardEvents = (cal) => {
     if (this.inputField) {
-      this.inputField.addEventListener('keydown', e => {
+      this.inputField.addEventListener('keydown', (e) => {
         if (match(e, keys.ArrowDown)) {
           (
             cal.selectedDateElem ||
@@ -444,12 +444,12 @@ export default class DatePicker extends Component {
       this.inputField.addEventListener('change', this.onChange);
     }
     if (this.toInputField) {
-      this.toInputField.addEventListener('blur', evt => {
+      this.toInputField.addEventListener('blur', (evt) => {
         if (!this.cal.calendarContainer.contains(evt.relatedTarget)) {
           this.cal.close();
         }
       });
-      this.toInputField.addEventListener('keydown', e => {
+      this.toInputField.addEventListener('keydown', (e) => {
         if (match(e, keys.ArrowDown)) {
           (
             cal.selectedDateElem ||
@@ -485,7 +485,7 @@ export default class DatePicker extends Component {
     }
   };
 
-  updateClassNames = calendar => {
+  updateClassNames = (calendar) => {
     const calendarContainer = calendar.calendarContainer;
     const daysContainer = calendar.days;
     if (calendarContainer && daysContainer) {
@@ -502,13 +502,13 @@ export default class DatePicker extends Component {
         .classList.add(`${prefix}--date-picker__days`);
       forEach.call(
         calendarContainer.querySelectorAll('.flatpickr-weekday'),
-        item => {
+        (item) => {
           const currentItem = item;
           currentItem.innerHTML = currentItem.innerHTML.replace(/\s+/g, '');
           currentItem.classList.add(`${prefix}--date-picker__weekday`);
         }
       );
-      forEach.call(daysContainer.querySelectorAll('.flatpickr-day'), item => {
+      forEach.call(daysContainer.querySelectorAll('.flatpickr-day'), (item) => {
         item.classList.add(`${prefix}--date-picker__day`);
         if (
           item.classList.contains('today') &&
@@ -525,7 +525,7 @@ export default class DatePicker extends Component {
     }
   };
 
-  assignInputFieldRef = node => {
+  assignInputFieldRef = (node) => {
     this.inputField = !node
       ? null
       : // Child is a regular DOM node, seen in tests
@@ -537,7 +537,7 @@ export default class DatePicker extends Component {
       : null;
   };
 
-  assignToInputFieldRef = node => {
+  assignToInputFieldRef = (node) => {
     this.toInputField = !node
       ? null
       : // Child is a regular DOM node, seen in tests
@@ -549,8 +549,8 @@ export default class DatePicker extends Component {
       : null;
   };
 
-  isLabelTextEmpty = children =>
-    children.every(child => !child.props.labelText);
+  isLabelTextEmpty = (children) =>
+    children.every((child) => !child.props.labelText);
 
   render() {
     const {
diff --git a/packages/react/src/components/DatePicker/plugins/appendToPlugin.js b/packages/react/src/components/DatePicker/plugins/appendToPlugin.js
index bbf0976ee853..4b52f8e17c4d 100644
--- a/packages/react/src/components/DatePicker/plugins/appendToPlugin.js
+++ b/packages/react/src/components/DatePicker/plugins/appendToPlugin.js
@@ -11,7 +11,7 @@
  * @param {object} config Plugin configuration.
  * @returns {Plugin} A Flatpickr plugin to put adjust the position of calendar dropdown.
  */
-export default config => fp => {
+export default (config) => (fp) => {
   /**
    * Adjusts the floating meun position after Flatpicker sets it.
    */
diff --git a/packages/react/src/components/DatePicker/plugins/fixEventsPlugin.js b/packages/react/src/components/DatePicker/plugins/fixEventsPlugin.js
index 457397685a9f..ca16f9d977cb 100644
--- a/packages/react/src/components/DatePicker/plugins/fixEventsPlugin.js
+++ b/packages/react/src/components/DatePicker/plugins/fixEventsPlugin.js
@@ -11,11 +11,11 @@ import { match, keys } from '../../../internal/keyboard';
  * @param {object} config Plugin configuration.
  * @returns {Plugin} A Flatpickr plugin to fix Flatpickr's behavior of certain events.
  */
-export default config => fp => {
+export default (config) => (fp) => {
   /**
    * Handles `keydown` event.
    */
-  const handleKeydown = event => {
+  const handleKeydown = (event) => {
     const { inputFrom, inputTo } = config;
     const { target } = event;
     if (inputFrom === target || inputTo === target) {
diff --git a/packages/react/src/components/DatePicker/plugins/rangePlugin.js b/packages/react/src/components/DatePicker/plugins/rangePlugin.js
index 46f64fec936f..60408170d91c 100644
--- a/packages/react/src/components/DatePicker/plugins/rangePlugin.js
+++ b/packages/react/src/components/DatePicker/plugins/rangePlugin.js
@@ -7,9 +7,9 @@ import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';
  *     Workaround for: https://github.com/flatpickr/flatpickr/issues/1944
  *   * A logic to ensure `fp.setDate()` call won't end up with "startDate to endDate" set to the first `<input>`
  */
-export default config => {
+export default (config) => {
   const factory = rangePlugin(Object.assign({ position: 'left' }, config));
-  return fp => {
+  return (fp) => {
     const origSetDate = fp.setDate;
 
     const init = () => {
diff --git a/packages/react/src/components/DatePickerInput/DatePickerInput.js b/packages/react/src/components/DatePickerInput/DatePickerInput.js
index c6025c820fcb..818ba3a8c82d 100644
--- a/packages/react/src/components/DatePickerInput/DatePickerInput.js
+++ b/packages/react/src/components/DatePickerInput/DatePickerInput.js
@@ -110,12 +110,12 @@ export default class DatePickerInput extends Component {
 
     const datePickerInputProps = {
       id,
-      onChange: evt => {
+      onChange: (evt) => {
         if (!disabled) {
           onChange(evt);
         }
       },
-      onClick: evt => {
+      onClick: (evt) => {
         if (!disabled) {
           onClick(evt);
         }
@@ -168,7 +168,7 @@ export default class DatePickerInput extends Component {
         {...other}
         {...datePickerInputProps}
         disabled={disabled}
-        ref={input => {
+        ref={(input) => {
           this.input = input;
         }}
         data-invalid
@@ -176,7 +176,7 @@ export default class DatePickerInput extends Component {
       />
     ) : (
       <input
-        ref={input => {
+        ref={(input) => {
           this.input = input;
         }}
         {...other}
diff --git a/packages/react/src/components/Dropdown/Dropdown-story.js b/packages/react/src/components/Dropdown/Dropdown-story.js
index 3330ffaea17c..1cf64c78f0fb 100644
--- a/packages/react/src/components/Dropdown/Dropdown-story.js
+++ b/packages/react/src/components/Dropdown/Dropdown-story.js
@@ -81,7 +81,7 @@ storiesOf('Dropdown', module)
         <Dropdown
           {...props()}
           items={items}
-          itemToString={item => (item ? item.text : '')}
+          itemToString={(item) => (item ? item.text : '')}
           onChange={action('onChange')}
         />
       </div>
@@ -100,7 +100,7 @@ storiesOf('Dropdown', module)
           {...props()}
           type="inline"
           items={items}
-          itemToString={item => (item ? item.text : '')}
+          itemToString={(item) => (item ? item.text : '')}
           onChange={action('onChange')}
         />
       </div>
@@ -137,7 +137,7 @@ storiesOf('Dropdown', module)
             <Dropdown
               {...props()}
               items={items}
-              itemToString={item => (item ? item.text : '')}
+              itemToString={(item) => (item ? item.text : '')}
               onChange={({ selectedItem }) =>
                 setTimeout(() => setState({ selectedItem }), 1000)
               }
diff --git a/packages/react/src/components/Dropdown/Dropdown-test.js b/packages/react/src/components/Dropdown/Dropdown-test.js
index ea9f4f5f1d72..a9eb12dcea8e 100644
--- a/packages/react/src/components/Dropdown/Dropdown-test.js
+++ b/packages/react/src/components/Dropdown/Dropdown-test.js
@@ -59,7 +59,7 @@ describe('Dropdown', () => {
   it('should render custom item components', () => {
     const wrapper = mount(<Dropdown {...mockProps} />);
     wrapper.setProps({
-      itemToElement: item => <div className="mock-item">{item.label}</div>,
+      itemToElement: (item) => <div className="mock-item">{item.label}</div>,
     });
     openMenu(wrapper);
     expect(wrapper).toMatchSnapshot();
diff --git a/packages/react/src/components/Dropdown/Dropdown.js b/packages/react/src/components/Dropdown/Dropdown.js
index 181cd83aeea2..52824742a313 100644
--- a/packages/react/src/components/Dropdown/Dropdown.js
+++ b/packages/react/src/components/Dropdown/Dropdown.js
@@ -15,7 +15,7 @@ import { Checkmark16, WarningFilled16 } from '@carbon/icons-react';
 
 const { prefix } = settings;
 
-const defaultItemToString = item => {
+const defaultItemToString = (item) => {
   if (typeof item === 'string') {
     return item;
   }
diff --git a/packages/react/src/components/ErrorBoundary/__tests__/ErrorBoundary-test.js b/packages/react/src/components/ErrorBoundary/__tests__/ErrorBoundary-test.js
index cddd95a3247f..c2e8a9396d19 100644
--- a/packages/react/src/components/ErrorBoundary/__tests__/ErrorBoundary-test.js
+++ b/packages/react/src/components/ErrorBoundary/__tests__/ErrorBoundary-test.js
@@ -77,11 +77,11 @@ describe('ErrorBoundary', () => {
       if (shouldThrowError) {
         throw new Error('test error');
       }
-      return <span ref={element => (content = element)}>mock</span>;
+      return <span ref={(element) => (content = element)}>mock</span>;
     }
 
     function MockFallback() {
-      return <span ref={element => (fallback = element)}>mock</span>;
+      return <span ref={(element) => (fallback = element)}>mock</span>;
     }
 
     function MockTest() {
@@ -93,7 +93,7 @@ describe('ErrorBoundary', () => {
 
       return (
         <ErrorBoundaryContext.Provider value={{ log: jest.fn() }}>
-          <button ref={element => (button = element)} onClick={onClick}>
+          <button ref={(element) => (button = element)} onClick={onClick}>
             Toggle
           </button>
           <ErrorBoundary fallback={<MockFallback />}>
diff --git a/packages/react/src/components/FileUploader/FileUploader.js b/packages/react/src/components/FileUploader/FileUploader.js
index 0c2cea3d34b2..52abf2abda86 100644
--- a/packages/react/src/components/FileUploader/FileUploader.js
+++ b/packages/react/src/components/FileUploader/FileUploader.js
@@ -121,11 +121,11 @@ export default class FileUploader extends React.Component {
         };
   }
 
-  handleChange = evt => {
+  handleChange = (evt) => {
     evt.stopPropagation();
     const filenames = Array.prototype.map.call(
       evt.target.files,
-      file => file.name
+      (file) => file.name
     );
     this.setState({
       filenames: this.props.multiple
@@ -141,7 +141,7 @@ export default class FileUploader extends React.Component {
     if (filenameStatus === 'edit') {
       evt.stopPropagation();
       const filteredArray = this.state.filenames.filter(
-        filename => filename !== this.nodes[index].innerText.trim()
+        (filename) => filename !== this.nodes[index].innerText.trim()
       );
       this.setState({ filenames: filteredArray });
       if (this.props.onDelete) {
@@ -204,19 +204,19 @@ export default class FileUploader extends React.Component {
                 <span
                   key={index}
                   className={selectedFileClasses}
-                  ref={node => (this.nodes[index] = node)} // eslint-disable-line
+                  ref={(node) => (this.nodes[index] = node)} // eslint-disable-line
                   {...other}>
                   <p className={`${prefix}--file-filename`}>{name}</p>
                   <span className={`${prefix}--file__state-container`}>
                     <Filename
                       iconDescription={iconDescription}
                       status={filenameStatus}
-                      onKeyDown={evt => {
+                      onKeyDown={(evt) => {
                         if (matches(evt, [keys.Enter, keys.Space])) {
                           this.handleClick(evt, { index, filenameStatus });
                         }
                       }}
-                      onClick={evt =>
+                      onClick={(evt) =>
                         this.handleClick(evt, { index, filenameStatus })
                       }
                     />
diff --git a/packages/react/src/components/FileUploader/FileUploaderDropContainer.js b/packages/react/src/components/FileUploader/FileUploaderDropContainer.js
index 82822b377ae8..d03778640c98 100644
--- a/packages/react/src/components/FileUploader/FileUploaderDropContainer.js
+++ b/packages/react/src/components/FileUploader/FileUploaderDropContainer.js
@@ -70,7 +70,7 @@ function FileUploaderDropContainer({
   return (
     <div
       className={`${prefix}--file`}
-      onDragOver={evt => {
+      onDragOver={(evt) => {
         evt.stopPropagation();
         evt.preventDefault();
         if (disabled) {
@@ -79,7 +79,7 @@ function FileUploaderDropContainer({
         setActive(true);
         evt.dataTransfer.dropEffect = 'copy';
       }}
-      onDragLeave={evt => {
+      onDragLeave={(evt) => {
         evt.stopPropagation();
         evt.preventDefault();
         if (disabled) {
@@ -88,7 +88,7 @@ function FileUploaderDropContainer({
         setActive(false);
         evt.dataTransfer.dropEffect = 'move';
       }}
-      onDrop={evt => {
+      onDrop={(evt) => {
         evt.stopPropagation();
         evt.preventDefault();
         if (disabled) {
@@ -101,7 +101,7 @@ function FileUploaderDropContainer({
         className={labelClasses}
         htmlFor={uid}
         tabIndex={tabIndex || 0}
-        onKeyDown={evt => {
+        onKeyDown={(evt) => {
           if (matches(evt, [keys.Enter, keys.Space])) {
             inputRef.current.click();
           }
@@ -120,7 +120,7 @@ function FileUploaderDropContainer({
             name={name}
             multiple={multiple}
             onChange={handleChange}
-            onClick={evt => {
+            onClick={(evt) => {
               evt.target.value = null;
             }}
           />
diff --git a/packages/react/src/components/FileUploader/FileUploaderItem.js b/packages/react/src/components/FileUploader/FileUploaderItem.js
index 835f8771258d..3abe8f95fbfc 100644
--- a/packages/react/src/components/FileUploader/FileUploaderItem.js
+++ b/packages/react/src/components/FileUploader/FileUploaderItem.js
@@ -41,14 +41,14 @@ function FileUploaderItem({
           iconDescription={iconDescription}
           status={status}
           invalid={invalid}
-          onKeyDown={evt => {
+          onKeyDown={(evt) => {
             if (matches(evt, [keys.Enter, keys.Space])) {
               if (status === 'edit') {
                 onDelete(evt, { uuid: id });
               }
             }
           }}
-          onClick={evt => {
+          onClick={(evt) => {
             if (status === 'edit') {
               onDelete(evt, { uuid: id });
             }
diff --git a/packages/react/src/components/FileUploader/__tests__/FileUploaderItem-test.js b/packages/react/src/components/FileUploader/__tests__/FileUploaderItem-test.js
index 89959bd53fab..7f0d55a9bf08 100644
--- a/packages/react/src/components/FileUploader/__tests__/FileUploaderItem-test.js
+++ b/packages/react/src/components/FileUploader/__tests__/FileUploaderItem-test.js
@@ -20,7 +20,7 @@ describe('FileUploaderItem', () => {
   describe('automated accessibility tests', () => {
     it.each(statuses)(
       'should have no axe violations with status %s',
-      async status => {
+      async (status) => {
         const { container } = render(
           <FileUploaderItem uuid="test" name="test" status={status} />
         );
diff --git a/packages/react/src/components/FileUploader/__tests__/Filename-test.js b/packages/react/src/components/FileUploader/__tests__/Filename-test.js
index 9740ba8316d5..085850f99fe6 100644
--- a/packages/react/src/components/FileUploader/__tests__/Filename-test.js
+++ b/packages/react/src/components/FileUploader/__tests__/Filename-test.js
@@ -19,7 +19,7 @@ describe('Filename', () => {
   describe.skip('automated accessibility tests', () => {
     it.each(statuses)(
       'should have no axe violations with status %s',
-      async status => {
+      async (status) => {
         const { container } = render(
           <Filename iconDescription="test description" status={status} />
         );
@@ -29,7 +29,7 @@ describe('Filename', () => {
 
     it.each(statuses)(
       'should have no DAP violations with status %s',
-      async status => {
+      async (status) => {
         const { container } = render(
           <Filename iconDescription="test description" status={status} />
         );
diff --git a/packages/react/src/components/FileUploader/stories/drop-container.js b/packages/react/src/components/FileUploader/stories/drop-container.js
index 45a5cf70b83f..147ceb95f532 100644
--- a/packages/react/src/components/FileUploader/stories/drop-container.js
+++ b/packages/react/src/components/FileUploader/stories/drop-container.js
@@ -16,10 +16,10 @@ const { prefix } = settings;
 
 function ExampleDropContainerApp(props) {
   const [files, setFiles] = useState([]);
-  const handleDrop = e => {
+  const handleDrop = (e) => {
     e.preventDefault();
   };
-  const handleDragover = e => {
+  const handleDragover = (e) => {
     e.preventDefault();
   };
   useEffect(() => {
@@ -30,7 +30,7 @@ function ExampleDropContainerApp(props) {
       document.removeEventListener('dragover', handleDragover);
     };
   }, []);
-  const uploadFile = async fileToUpload => {
+  const uploadFile = async (fileToUpload) => {
     // file size validation
     if (fileToUpload.filesize > 512000) {
       const updatedFile = {
@@ -41,8 +41,8 @@ function ExampleDropContainerApp(props) {
         errorSubject: 'File size exceeds limit',
         errorBody: '500kb max file size. Select a new file and try again.',
       };
-      setFiles(files =>
-        files.map(file =>
+      setFiles((files) =>
+        files.map((file) =>
           file.uuid === fileToUpload.uuid ? updatedFile : file
         )
       );
@@ -57,8 +57,8 @@ function ExampleDropContainerApp(props) {
         status: 'complete',
         iconDescription: 'Upload complete',
       };
-      setFiles(files =>
-        files.map(file =>
+      setFiles((files) =>
+        files.map((file) =>
           file.uuid === fileToUpload.uuid ? updatedFile : file
         )
       );
@@ -71,8 +71,8 @@ function ExampleDropContainerApp(props) {
         status: 'edit',
         iconDescription: 'Delete file',
       };
-      setFiles(files =>
-        files.map(file =>
+      setFiles((files) =>
+        files.map((file) =>
           file.uuid === fileToUpload.uuid ? updatedFile : file
         )
       );
@@ -81,7 +81,7 @@ function ExampleDropContainerApp(props) {
   const onAddFiles = useCallback(
     (evt, { addedFiles }) => {
       evt.stopPropagation();
-      const newFiles = addedFiles.map(file => ({
+      const newFiles = addedFiles.map((file) => ({
         uuid: uid(),
         name: file.name,
         filesize: file.size,
@@ -140,4 +140,4 @@ function ExampleDropContainerApp(props) {
   );
 }
 
-export default props => <ExampleDropContainerApp {...props} />;
+export default (props) => <ExampleDropContainerApp {...props} />;
diff --git a/packages/react/src/components/FluidForm/FluidForm-story.js b/packages/react/src/components/FluidForm/FluidForm-story.js
index 7afec1823a1f..045dbddd8543 100644
--- a/packages/react/src/components/FluidForm/FluidForm-story.js
+++ b/packages/react/src/components/FluidForm/FluidForm-story.js
@@ -15,7 +15,7 @@ import TextInput from '../TextInput';
 
 const additionalProps = {
   className: 'some-class',
-  onSubmit: e => {
+  onSubmit: (e) => {
     e.preventDefault();
     action('FormSubmitted')(e);
   },
diff --git a/packages/react/src/components/Form/Form-story.js b/packages/react/src/components/Form/Form-story.js
index 06337802dc62..f7ca15f20daa 100644
--- a/packages/react/src/components/Form/Form-story.js
+++ b/packages/react/src/components/Form/Form-story.js
@@ -27,7 +27,7 @@ import Toggle from '../Toggle';
 
 const additionalProps = {
   className: 'some-class',
-  onSubmit: e => {
+  onSubmit: (e) => {
     e.preventDefault();
     action('FormSubmitted')(e);
   },
diff --git a/packages/react/src/components/Grid/Grid-story.js b/packages/react/src/components/Grid/Grid-story.js
index 25e4bdb6057f..cd54f8ae985b 100644
--- a/packages/react/src/components/Grid/Grid-story.js
+++ b/packages/react/src/components/Grid/Grid-story.js
@@ -3,7 +3,7 @@ import React from 'react';
 import { Grid, Row, Column } from './';
 
 export default {
-  decorators: [storyFn => <div id="templates">{storyFn()}</div>],
+  decorators: [(storyFn) => <div id="templates">{storyFn()}</div>],
   title: 'Grid',
 };
 
diff --git a/packages/react/src/components/Grid/__tests__/Column-test.js b/packages/react/src/components/Grid/__tests__/Column-test.js
index 965cc1437b3d..398a518c07c1 100644
--- a/packages/react/src/components/Grid/__tests__/Column-test.js
+++ b/packages/react/src/components/Grid/__tests__/Column-test.js
@@ -88,7 +88,7 @@ describe('Column', () => {
 
   it.each(['sm', 'md', 'lg', 'xlg', 'max'])(
     'should support specifying column span and offset as an object for breakpoint %s',
-    breakpoint => {
+    (breakpoint) => {
       const { container } = render(
         React.createElement(Column, {
           [breakpoint]: {
diff --git a/packages/react/src/components/Icon/Icon-test.js b/packages/react/src/components/Icon/Icon-test.js
index 627d9520b590..908fbabde6bd 100644
--- a/packages/react/src/components/Icon/Icon-test.js
+++ b/packages/react/src/components/Icon/Icon-test.js
@@ -117,7 +117,7 @@ describe('Icon', () => {
         ],
       };
       expect(
-        svgShapes(svgData).map(item =>
+        svgShapes(svgData).map((item) =>
           item.map(({ type, key, props }) => ({ type, key, props }))
         )
       ).toEqual([
diff --git a/packages/react/src/components/Icon/Icon.js b/packages/react/src/components/Icon/Icon.js
index d1919f051930..019e4420f2a0 100644
--- a/packages/react/src/components/Icon/Icon.js
+++ b/packages/react/src/components/Icon/Icon.js
@@ -25,7 +25,7 @@ let iconsList = icons;
  * this.findIcon('copy-code', icons.json);
  */
 export function findIcon(name, iconsObj = iconsList) {
-  const icon = iconsObj.filter(obj => obj.name === name);
+  const icon = iconsObj.filter((obj) => obj.name === name);
 
   if (icon.length === 0) {
     return false;
@@ -68,8 +68,8 @@ export function getSvgData(iconName) {
  */
 export function svgShapes(svgData) {
   const svgElements = Object.keys(svgData)
-    .filter(key => svgData[key])
-    .map(svgProp => {
+    .filter((key) => svgData[key])
+    .map((svgProp) => {
       const data = svgData[svgProp];
 
       if (svgProp === 'circles') {
diff --git a/packages/react/src/components/InlineCheckbox/InlineCheckbox.js b/packages/react/src/components/InlineCheckbox/InlineCheckbox.js
index ac171aac2a6a..f9120d46dfee 100644
--- a/packages/react/src/components/InlineCheckbox/InlineCheckbox.js
+++ b/packages/react/src/components/InlineCheckbox/InlineCheckbox.js
@@ -87,7 +87,7 @@ class InlineCheckbox extends React.Component {
     }
   }
 
-  handleRef = el => {
+  handleRef = (el) => {
     this.inputNode = el;
   };
 
@@ -109,7 +109,7 @@ class InlineCheckbox extends React.Component {
       id,
       name,
       onClick,
-      onChange: evt => {
+      onChange: (evt) => {
         onChange(evt.target.checked, id, evt);
       },
       onKeyDown,
diff --git a/packages/react/src/components/InlineLoading/InlineLoading-test.js b/packages/react/src/components/InlineLoading/InlineLoading-test.js
index 746e747f9970..c8cc5453fde0 100644
--- a/packages/react/src/components/InlineLoading/InlineLoading-test.js
+++ b/packages/react/src/components/InlineLoading/InlineLoading-test.js
@@ -82,7 +82,7 @@ describe('Loading', () => {
       expect(wrapper.find(Loading).length).toEqual(0);
     });
 
-    it('should call the onSuccess function after a delay', done => {
+    it('should call the onSuccess function after a delay', (done) => {
       mount(
         <InlineLoading
           success
diff --git a/packages/react/src/components/Link/Link-story.js b/packages/react/src/components/Link/Link-story.js
index 35344080299b..3e914f085caa 100644
--- a/packages/react/src/components/Link/Link-story.js
+++ b/packages/react/src/components/Link/Link-story.js
@@ -18,7 +18,7 @@ const props = () => ({
   href: text('The link href (href)', '#'),
   inline: boolean('Use the in-line variant (inline)', false),
   visited: boolean('Allow visited styles', false),
-  onClick: (handler => evt => {
+  onClick: ((handler) => (evt) => {
     evt.preventDefault(); // Prevent link from being followed for demo purpose
     handler(evt);
   })(action('onClick')),
diff --git a/packages/react/src/components/ListBox/ListBox.js b/packages/react/src/components/ListBox/ListBox.js
index a2b8fc4ec9e6..77bbd73a9392 100644
--- a/packages/react/src/components/ListBox/ListBox.js
+++ b/packages/react/src/components/ListBox/ListBox.js
@@ -13,13 +13,13 @@ import { ListBoxType, ListBoxSize } from './ListBoxPropTypes';
 
 const { prefix } = settings;
 
-const handleOnKeyDown = event => {
+const handleOnKeyDown = (event) => {
   if (event.keyCode === 27) {
     event.stopPropagation();
   }
 };
 
-const handleClick = event => {
+const handleClick = (event) => {
   event.preventDefault();
   event.stopPropagation();
 };
diff --git a/packages/react/src/components/ListBox/ListBoxMenuIcon.js b/packages/react/src/components/ListBox/ListBoxMenuIcon.js
index fa95267abeb7..aa25c8b5f3fc 100644
--- a/packages/react/src/components/ListBox/ListBoxMenuIcon.js
+++ b/packages/react/src/components/ListBox/ListBoxMenuIcon.js
@@ -57,7 +57,7 @@ ListBoxMenuIcon.propTypes = {
 };
 
 ListBoxMenuIcon.defaultProps = {
-  translateWithId: id => defaultTranslations[id],
+  translateWithId: (id) => defaultTranslations[id],
 };
 
 export default ListBoxMenuIcon;
diff --git a/packages/react/src/components/ListBox/ListBoxSelection.js b/packages/react/src/components/ListBox/ListBoxSelection.js
index 5b5483372aeb..f6a1a4029962 100644
--- a/packages/react/src/components/ListBox/ListBoxSelection.js
+++ b/packages/react/src/components/ListBox/ListBoxSelection.js
@@ -30,7 +30,7 @@ const ListBoxSelection = ({
     [`${prefix}--tag--filter`]: selectionCount,
     [`${prefix}--list-box__selection--multi`]: selectionCount,
   });
-  const handleOnClick = event => {
+  const handleOnClick = (event) => {
     event.stopPropagation();
     if (disabled) {
       return;
@@ -40,7 +40,7 @@ const ListBoxSelection = ({
       onClearSelection(event);
     }
   };
-  const handleOnKeyDown = event => {
+  const handleOnKeyDown = (event) => {
     event.stopPropagation();
     if (disabled) {
       return;
@@ -119,7 +119,7 @@ ListBoxSelection.propTypes = {
 };
 
 ListBoxSelection.defaultProps = {
-  translateWithId: id => defaultTranslations[id],
+  translateWithId: (id) => defaultTranslations[id],
 };
 
 export default ListBoxSelection;
diff --git a/packages/react/src/components/ListBox/__tests__/ListBox-test.js b/packages/react/src/components/ListBox/__tests__/ListBox-test.js
index ace43b0e2a1a..f2a856123fe7 100644
--- a/packages/react/src/components/ListBox/__tests__/ListBox-test.js
+++ b/packages/react/src/components/ListBox/__tests__/ListBox-test.js
@@ -43,10 +43,7 @@ describe('ListBox', () => {
   it('should add the provided `className` to the root node', () => {
     const wrapper = mount(<ListBox {...mockProps} />);
     expect(
-      wrapper
-        .children()
-        .prop('className')
-        .includes(mockProps.className)
+      wrapper.children().prop('className').includes(mockProps.className)
     ).toBe(true);
   });
 });
diff --git a/packages/react/src/components/ListBox/test-helpers.js b/packages/react/src/components/ListBox/test-helpers.js
index af84d0ecd005..ede839252ef4 100644
--- a/packages/react/src/components/ListBox/test-helpers.js
+++ b/packages/react/src/components/ListBox/test-helpers.js
@@ -10,22 +10,23 @@ import { settings } from 'carbon-components';
 const { prefix } = settings;
 
 // Finding nodes in a ListBox
-export const findListBoxNode = wrapper => wrapper.find(`.${prefix}--list-box`);
-export const findMenuNode = wrapper =>
+export const findListBoxNode = (wrapper) =>
+  wrapper.find(`.${prefix}--list-box`);
+export const findMenuNode = (wrapper) =>
   wrapper.find(`.${prefix}--list-box__menu`);
 export const findMenuItemNode = (wrapper, index) =>
   wrapper.find('ListBoxMenuItem').at(index);
-export const findMenuIconNode = wrapper =>
+export const findMenuIconNode = (wrapper) =>
   wrapper.find(`.${prefix}--list-box__menu-icon`);
-export const findFieldNode = wrapper =>
+export const findFieldNode = (wrapper) =>
   wrapper.find(`.${prefix}--list-box__field`);
-export const findComboboxNode = wrapper =>
+export const findComboboxNode = (wrapper) =>
   wrapper.find(`.${prefix}--list-box[role="combobox"]`);
-export const findPopupNode = wrapper =>
+export const findPopupNode = (wrapper) =>
   wrapper.find('[aria-haspopup="listbox"]').hostNodes();
 
 // Actions
-export const openMenu = wrapper => findFieldNode(wrapper).simulate('click');
+export const openMenu = (wrapper) => findFieldNode(wrapper).simulate('click');
 
 // Common assertions, useful for validating a11y props are set when needed
 export const assertMenuOpen = (wrapper, mockProps) => {
@@ -35,7 +36,7 @@ export const assertMenuOpen = (wrapper, mockProps) => {
   );
   expect(findPopupNode(wrapper).prop('aria-expanded')).toBe(true);
 };
-export const assertMenuClosed = wrapper => {
+export const assertMenuClosed = (wrapper) => {
   expect(findMenuIconNode(wrapper).prop('className')).toEqual(
     expect.stringContaining(`${prefix}--list-box__menu-icon`)
   );
@@ -53,7 +54,7 @@ export const assertMenuClosed = wrapper => {
  *
  * @returns {{id: string, label: string, value: string}}
  */
-export const generateGenericItem = index => ({
+export const generateGenericItem = (index) => ({
   id: `id-${index}`,
   label: `Item ${index}`,
   value: index,
@@ -67,7 +68,7 @@ export const generateGenericItem = index => ({
  *
  * @returns {{field: string, value: string}}
  */
-export const generateCustomItem = index => ({
+export const generateCustomItem = (index) => ({
   field: `Item ${index}`,
   value: `Custom value ${index}`,
 });
diff --git a/packages/react/src/components/Modal/Modal-test.js b/packages/react/src/components/Modal/Modal-test.js
index cb22465552bb..8133b78e616f 100644
--- a/packages/react/src/components/Modal/Modal-test.js
+++ b/packages/react/src/components/Modal/Modal-test.js
@@ -16,7 +16,7 @@ import { settings } from 'carbon-components';
 const { prefix } = settings;
 
 // The modal is the 0th child inside the wrapper on account of focus-trap-react
-const getModal = wrapper => wrapper.find('.bx--modal');
+const getModal = (wrapper) => wrapper.find('.bx--modal');
 
 describe('Modal', () => {
   describe('Renders as expected', () => {
diff --git a/packages/react/src/components/Modal/Modal.js b/packages/react/src/components/Modal/Modal.js
index 069cab711def..28306733524a 100644
--- a/packages/react/src/components/Modal/Modal.js
+++ b/packages/react/src/components/Modal/Modal.js
@@ -185,7 +185,7 @@ export default class Modal extends Component {
   modalLabelId = `${prefix}--modal-header__label--${this.modalInstanceId}`;
   modalHeadingId = `${prefix}--modal-header__heading--${this.modalInstanceId}`;
 
-  handleKeyDown = evt => {
+  handleKeyDown = (evt) => {
     if (this.props.open) {
       if (evt.which === 27) {
         this.props.onRequestClose(evt);
@@ -196,7 +196,7 @@ export default class Modal extends Component {
     }
   };
 
-  handleMousedown = evt => {
+  handleMousedown = (evt) => {
     if (
       this.innerModal.current &&
       !this.innerModal.current.contains(evt.target) &&
@@ -242,7 +242,7 @@ export default class Modal extends Component {
     );
   }
 
-  initialFocus = focusContainerElement => {
+  initialFocus = (focusContainerElement) => {
     const containerElement = focusContainerElement || this.innerModal.current;
     const primaryFocusElement = containerElement
       ? containerElement.querySelector(this.props.selectorPrimaryFocus)
@@ -255,7 +255,7 @@ export default class Modal extends Component {
     return this.button && this.button.current;
   };
 
-  focusButton = focusContainerElement => {
+  focusButton = (focusContainerElement) => {
     const target = this.initialFocus(focusContainerElement);
     if (target) {
       target.focus();
@@ -278,7 +278,7 @@ export default class Modal extends Component {
     this.focusButton(this.innerModal.current);
   }
 
-  handleTransitionEnd = evt => {
+  handleTransitionEnd = (evt) => {
     if (
       evt.target === evt.currentTarget && // Not to handle `onTransitionEnd` on child DOM nodes
       this.outerModal.current &&
diff --git a/packages/react/src/components/ModalWrapper/ModalWrapper-story.js b/packages/react/src/components/ModalWrapper/ModalWrapper-story.js
index e372a7acccbb..c4c9df89e717 100644
--- a/packages/react/src/components/ModalWrapper/ModalWrapper-story.js
+++ b/packages/react/src/components/ModalWrapper/ModalWrapper-story.js
@@ -31,10 +31,12 @@ const icons = {
 const iconMap = {
   iconAddSolid,
   iconSearch,
-  AddFilled16: props => (
+  AddFilled16: (props) => (
     <AddFilled16 className={`${prefix}--btn__icon`} {...props} />
   ),
-  Search16: props => <Search16 className={`${prefix}--btn__icon`} {...props} />,
+  Search16: (props) => (
+    <Search16 className={`${prefix}--btn__icon`} {...props} />
+  ),
 };
 
 const props = () => {
diff --git a/packages/react/src/components/ModalWrapper/ModalWrapper.js b/packages/react/src/components/ModalWrapper/ModalWrapper.js
index 18bfc6a2f467..6ef76f02d592 100644
--- a/packages/react/src/components/ModalWrapper/ModalWrapper.js
+++ b/packages/react/src/components/ModalWrapper/ModalWrapper.js
@@ -100,7 +100,7 @@ export default class ModalWrapper extends React.Component {
     return (
       <div
         role="presentation"
-        onKeyDown={evt => {
+        onKeyDown={(evt) => {
           if (evt.which === 27) {
             this.handleClose();
             onKeyDown(evt);
diff --git a/packages/react/src/components/MultiSelect/FilterableMultiSelect.js b/packages/react/src/components/MultiSelect/FilterableMultiSelect.js
index 489f35af3c3b..9f2a810638ad 100644
--- a/packages/react/src/components/MultiSelect/FilterableMultiSelect.js
+++ b/packages/react/src/components/MultiSelect/FilterableMultiSelect.js
@@ -166,14 +166,14 @@ export default class FilterableMultiSelect extends React.Component {
     };
   }
 
-  handleOnChange = changes => {
+  handleOnChange = (changes) => {
     if (this.props.onChange) {
       this.props.onChange(changes);
     }
   };
 
   handleOnToggleMenu = () => {
-    this.setState(state => ({
+    this.setState((state) => ({
       isOpen: !state.isOpen,
     }));
   };
@@ -228,7 +228,7 @@ export default class FilterableMultiSelect extends React.Component {
     }
   };
 
-  handleOnInputKeyDown = event => {
+  handleOnInputKeyDown = (event) => {
     event.stopPropagation();
   };
 
@@ -247,7 +247,7 @@ export default class FilterableMultiSelect extends React.Component {
       });
   };
 
-  clearInputValue = event => {
+  clearInputValue = (event) => {
     event.stopPropagation();
     this.setState({ inputValue: '' });
     this.inputNode && this.inputNode.focus && this.inputNode.focus();
@@ -327,7 +327,7 @@ export default class FilterableMultiSelect extends React.Component {
             isOpen={isOpen}
             inputValue={inputValue}
             onInputValueChange={this.handleOnInputValueChange}
-            onChange={selectedItem => {
+            onChange={(selectedItem) => {
               // `selectedItem`: The item that was just selected. null if the selection was cleared.
               // https://github.com/downshift-js/downshift#onchange
               if (selectedItem === null) {
@@ -394,7 +394,7 @@ export default class FilterableMultiSelect extends React.Component {
                       className={inputClasses}
                       aria-controls={`${id}__menu`}
                       aria-autocomplete="list"
-                      ref={el => (this.inputNode = el)}
+                      ref={(el) => (this.inputNode = el)}
                       {...getInputProps({
                         disabled,
                         id,
@@ -439,7 +439,7 @@ export default class FilterableMultiSelect extends React.Component {
                         const itemProps = getItemProps({ item });
                         const itemText = itemToString(item);
                         const isChecked =
-                          selectedItem.filter(selected =>
+                          selectedItem.filter((selected) =>
                             isEqual(selected, item)
                           ).length > 0;
                         return (
diff --git a/packages/react/src/components/MultiSelect/MultiSelect-story.js b/packages/react/src/components/MultiSelect/MultiSelect-story.js
index b1b7e88a5ba2..e2638acc19e4 100644
--- a/packages/react/src/components/MultiSelect/MultiSelect-story.js
+++ b/packages/react/src/components/MultiSelect/MultiSelect-story.js
@@ -110,8 +110,8 @@ storiesOf('MultiSelect', module)
           <MultiSelect
             {...multiSelectProps}
             items={items}
-            itemToString={item => (item ? item.text : '')}
-            translateWithId={id => listBoxMenuIconTranslationIds[id]}
+            itemToString={(item) => (item ? item.text : '')}
+            translateWithId={(id) => listBoxMenuIconTranslationIds[id]}
             selectionFeedback={selectionFeedback}
           />
         </div>
@@ -139,9 +139,9 @@ storiesOf('MultiSelect', module)
           <MultiSelect
             {...multiSelectProps}
             items={items}
-            itemToString={item => (item ? item.text : '')}
+            itemToString={(item) => (item ? item.text : '')}
             initialSelectedItems={[items[0], items[1]]}
-            translateWithId={id => listBoxMenuIconTranslationIds[id]}
+            translateWithId={(id) => listBoxMenuIconTranslationIds[id]}
             selectionFeedback={selectionFeedback}
           />
         </div>
@@ -169,9 +169,9 @@ storiesOf('MultiSelect', module)
           <MultiSelect.Filterable
             {...multiSelectProps}
             items={items}
-            itemToString={item => (item ? item.text : '')}
+            itemToString={(item) => (item ? item.text : '')}
             placeholder={defaultPlaceholder}
-            translateWithId={id => listBoxMenuIconTranslationIds[id]}
+            translateWithId={(id) => listBoxMenuIconTranslationIds[id]}
             selectionFeedback={selectionFeedback}
           />
         </div>
diff --git a/packages/react/src/components/MultiSelect/MultiSelect.js b/packages/react/src/components/MultiSelect/MultiSelect.js
index 7e915e8bf893..d8a582595e1e 100644
--- a/packages/react/src/components/MultiSelect/MultiSelect.js
+++ b/packages/react/src/components/MultiSelect/MultiSelect.js
@@ -216,7 +216,7 @@ function MultiSelect({
               });
               const itemText = itemToString(item);
               const isChecked =
-                selectedItems.filter(selected => isEqual(selected, item))
+                selectedItems.filter((selected) => isEqual(selected, item))
                   .length > 0;
               return (
                 <ListBox.MenuItem
diff --git a/packages/react/src/components/MultiSelect/README.md b/packages/react/src/components/MultiSelect/README.md
index 3ab331d423dc..efe0a2844cc0 100644
--- a/packages/react/src/components/MultiSelect/README.md
+++ b/packages/react/src/components/MultiSelect/README.md
@@ -106,6 +106,6 @@ the list. For instance you can use:
     { id: 'item-2', text: 'Item 2' },
   ]}
   translateWithId={translateWithId}
-  itemToString={item => (item ? item.text : '')}
+  itemToString={(item) => (item ? item.text : '')}
 />
 ```
diff --git a/packages/react/src/components/MultiSelect/__tests__/FilterableMultiSelect-test.js b/packages/react/src/components/MultiSelect/__tests__/FilterableMultiSelect-test.js
index 9ec8e18fc656..ecacc2b76962 100644
--- a/packages/react/src/components/MultiSelect/__tests__/FilterableMultiSelect-test.js
+++ b/packages/react/src/components/MultiSelect/__tests__/FilterableMultiSelect-test.js
@@ -95,20 +95,14 @@ describe('MultiSelect.Filterable', () => {
     openMenu(wrapper);
 
     // Select the first two items
-    wrapper
-      .find(listItemName)
-      .at(0)
-      .simulate('click');
+    wrapper.find(listItemName).at(0).simulate('click');
 
     expect(mockProps.onChange).toHaveBeenCalledTimes(1);
     expect(mockProps.onChange).toHaveBeenCalledWith({
       selectedItems: [mockProps.items[0]],
     });
 
-    wrapper
-      .find(listItemName)
-      .at(1)
-      .simulate('click');
+    wrapper.find(listItemName).at(1).simulate('click');
 
     expect(mockProps.onChange).toHaveBeenCalledTimes(2);
     expect(mockProps.onChange).toHaveBeenCalledWith({
@@ -116,19 +110,13 @@ describe('MultiSelect.Filterable', () => {
     });
 
     // Un-select the next two items
-    wrapper
-      .find(listItemName)
-      .at(0)
-      .simulate('click');
+    wrapper.find(listItemName).at(0).simulate('click');
     expect(mockProps.onChange).toHaveBeenCalledTimes(3);
     expect(mockProps.onChange).toHaveBeenCalledWith({
       selectedItems: [mockProps.items[0]],
     });
 
-    wrapper
-      .find(listItemName)
-      .at(0)
-      .simulate('click');
+    wrapper.find(listItemName).at(0).simulate('click');
     expect(mockProps.onChange).toHaveBeenCalledTimes(4);
     expect(mockProps.onChange).toHaveBeenCalledWith({
       selectedItems: [],
@@ -142,20 +130,14 @@ describe('MultiSelect.Filterable', () => {
     openMenu(wrapper);
 
     // Select the first two items
-    wrapper
-      .find(listItemName)
-      .at(1)
-      .simulate('click');
+    wrapper.find(listItemName).at(1).simulate('click');
 
     expect(mockProps.onChange).toHaveBeenCalledTimes(1);
     expect(mockProps.onChange).toHaveBeenCalledWith({
       selectedItems: [mockProps.items[1]],
     });
 
-    wrapper
-      .find(listItemName)
-      .at(1)
-      .simulate('click');
+    wrapper.find(listItemName).at(1).simulate('click');
 
     expect(mockProps.onChange).toHaveBeenCalledTimes(2);
     expect(mockProps.onChange).toHaveBeenCalledWith({
@@ -172,16 +154,10 @@ describe('MultiSelect.Filterable', () => {
       .at(1)
       .simulate('change', { target: { value: '3' } });
 
-    wrapper
-      .find(listItemName)
-      .at(0)
-      .simulate('click');
+    wrapper.find(listItemName).at(0).simulate('click');
 
     expect(
-      wrapper
-        .find('[placeholder="Placeholder..."]')
-        .at(1)
-        .props().value
+      wrapper.find('[placeholder="Placeholder..."]').at(1).props().value
     ).toEqual('3');
   });
 });
diff --git a/packages/react/src/components/MultiSelect/__tests__/MultiSelect-test.js b/packages/react/src/components/MultiSelect/__tests__/MultiSelect-test.js
index d94e96b5c287..f66be892a39f 100644
--- a/packages/react/src/components/MultiSelect/__tests__/MultiSelect-test.js
+++ b/packages/react/src/components/MultiSelect/__tests__/MultiSelect-test.js
@@ -292,7 +292,7 @@ describe('MultiSelect', () => {
           id="custom-id"
           label={label}
           items={items}
-          itemToString={item => (item ? item.text : '')}
+          itemToString={(item) => (item ? item.text : '')}
         />
       );
       const labelNode = getByText(container, label);
diff --git a/packages/react/src/components/MultiSelect/tools/__tests__/sorting-test.js b/packages/react/src/components/MultiSelect/tools/__tests__/sorting-test.js
index 8166c6f4feb2..c8f698519af9 100644
--- a/packages/react/src/components/MultiSelect/tools/__tests__/sorting-test.js
+++ b/packages/react/src/components/MultiSelect/tools/__tests__/sorting-test.js
@@ -22,7 +22,7 @@ describe('defaultSortItems', () => {
   });
 
   it('should sort un-selected options alphabetically', () => {
-    const mockItems = ['d', 'c', 'b', 'a'].map(label => ({ label }));
+    const mockItems = ['d', 'c', 'b', 'a'].map((label) => ({ label }));
     expect(defaultSortItems(mockItems, mockOptions)).toEqual([
       {
         label: 'a',
@@ -40,7 +40,7 @@ describe('defaultSortItems', () => {
   });
 
   it('should sort un-selected numbers in increasing order', () => {
-    const mockItems = ['1', '10', '11', '2', '3'].map(label => ({ label }));
+    const mockItems = ['1', '10', '11', '2', '3'].map((label) => ({ label }));
     expect(defaultSortItems(mockItems, mockOptions)).toEqual([
       {
         label: '1',
@@ -66,7 +66,7 @@ describe('defaultSortItems', () => {
       'Option 10',
       'Option 11',
       'Option 2',
-    ].map(label => ({ label }));
+    ].map((label) => ({ label }));
     expect(defaultSortItems(mockItems, mockOptions)).toEqual([
       {
         label: 'Option 1',
@@ -89,7 +89,7 @@ describe('defaultSortItems', () => {
       'Option 10',
       'Option 11',
       'Option 2',
-    ].map(label => ({ label }));
+    ].map((label) => ({ label }));
 
     // Set `selectedItems` to ['Option 11']
     mockOptions.selectedItems = [mockItems[2]];
@@ -116,7 +116,7 @@ describe('defaultSortItems', () => {
       'Option 10',
       'Option 11',
       'Option 2',
-    ].map(label => ({ label }));
+    ].map((label) => ({ label }));
 
     // Set `selectedItems` to ['Option 11', 'Option 2']
     mockOptions.selectedItems = [mockItems[2], mockItems[3]];
diff --git a/packages/react/src/components/MultiSelect/tools/itemToString.js b/packages/react/src/components/MultiSelect/tools/itemToString.js
index b5ba24092458..5f1e0e655657 100644
--- a/packages/react/src/components/MultiSelect/tools/itemToString.js
+++ b/packages/react/src/components/MultiSelect/tools/itemToString.js
@@ -7,7 +7,7 @@
 
 import invariant from 'invariant';
 
-const itemToString = item => {
+const itemToString = (item) => {
   invariant(
     typeof item.label === 'string',
     '[MultiSelect] the default `itemToString` method expected to receive ' +
@@ -17,7 +17,7 @@ const itemToString = item => {
   return item.label || '';
 };
 
-export const defaultItemToString = item => {
+export const defaultItemToString = (item) => {
   if (Array.isArray(item)) {
     return item.map(itemToString);
   }
diff --git a/packages/react/src/components/Notification/Notification-test.js b/packages/react/src/components/Notification/Notification-test.js
index cff010fbb3dc..a86dd84b8d78 100644
--- a/packages/react/src/components/Notification/Notification-test.js
+++ b/packages/react/src/components/Notification/Notification-test.js
@@ -125,7 +125,7 @@ describe('ToastNotification', () => {
     it('interpolates matching className based on kind prop', () => {
       const kinds = ['error', 'info', 'success', 'warning'];
 
-      kinds.forEach(kind => {
+      kinds.forEach((kind) => {
         toast.setProps({ kind });
         expect(
           toast.hasClass(`${prefix}--toast-notification--${kind}`)
@@ -236,7 +236,7 @@ describe('InlineNotification', () => {
     it('interpolates matching className based on kind prop', () => {
       const kinds = ['error', 'info', 'success', 'warning'];
 
-      kinds.forEach(kind => {
+      kinds.forEach((kind) => {
         inline.setProps({ kind });
         expect(
           inline.find(`.${prefix}--inline-notification--${kind}`).exists()
diff --git a/packages/react/src/components/NumberInput/NumberInput-story.js b/packages/react/src/components/NumberInput/NumberInput-story.js
index b7244b087e04..027ba0beed24 100644
--- a/packages/react/src/components/NumberInput/NumberInput-story.js
+++ b/packages/react/src/components/NumberInput/NumberInput-story.js
@@ -68,7 +68,7 @@ storiesOf('NumberInput', module)
       const { numberInputArrowTranslationIds, ...rest } = props();
       return (
         <NumberInput
-          translateWithId={id => numberInputArrowTranslationIds[id]}
+          translateWithId={(id) => numberInputArrowTranslationIds[id]}
           {...rest}
         />
       );
diff --git a/packages/react/src/components/NumberInput/NumberInput-test.js b/packages/react/src/components/NumberInput/NumberInput-test.js
index b3080c10c026..92c4059010df 100644
--- a/packages/react/src/components/NumberInput/NumberInput-test.js
+++ b/packages/react/src/components/NumberInput/NumberInput-test.js
@@ -49,7 +49,7 @@ describe('NumberInput', () => {
       numberInput = wrapper.find('input');
       container = wrapper.find(`.${prefix}--number`);
       formItem = wrapper.find(`.${prefix}--form-item`);
-      icons = wrapper.findWhere(n => iconTypes.includes(n.type()));
+      icons = wrapper.findWhere((n) => iconTypes.includes(n.type()));
       helper = wrapper.find(`.${prefix}--form__helper-text`);
     });
 
@@ -153,7 +153,7 @@ describe('NumberInput', () => {
               className="extra-class"
             />
           );
-        const getNumberInput = wrapper => wrapper.find('input');
+        const getNumberInput = (wrapper) => wrapper.find('input');
 
         it('should set value as expected when value > min', () => {
           const wrapper = getWrapper(-1, 100, 0);
@@ -181,10 +181,7 @@ describe('NumberInput', () => {
 
         it('should set invalidText when value is empty string', () => {
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: '' });
+          wrapper.find('NumberInput').instance().setState({ value: '' });
           wrapper.update();
           const invalidText = wrapper.find(`.${prefix}--form-requirement`);
           expect(invalidText.length).toEqual(1);
@@ -194,10 +191,7 @@ describe('NumberInput', () => {
 
         it('allow empty string value', () => {
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: '' });
+          wrapper.find('NumberInput').instance().setState({ value: '' });
 
           wrapper.update();
           wrapper.setProps({ allowEmpty: true });
@@ -207,10 +201,7 @@ describe('NumberInput', () => {
 
         it('should allow updating the value with empty string and not be invalid', () => {
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: 50 });
+          wrapper.find('NumberInput').instance().setState({ value: 50 });
 
           wrapper.update();
           wrapper.setProps({ value: '', allowEmpty: true });
@@ -222,10 +213,7 @@ describe('NumberInput', () => {
         it('should change the value upon change in props', () => {
           wrapper.setProps({ value: 1 });
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: 1 });
+          wrapper.find('NumberInput').instance().setState({ value: 1 });
           wrapper.update();
           wrapper.setProps({ value: 2 });
           // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
@@ -234,10 +222,7 @@ describe('NumberInput', () => {
 
         it('should cap the number given to value prop', () => {
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: 0 });
+          wrapper.find('NumberInput').instance().setState({ value: 0 });
           wrapper.update();
           wrapper.setProps({ value: 5, min: 10, max: 20 });
           // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
@@ -254,10 +239,7 @@ describe('NumberInput', () => {
         // NumberInput propTypes do not allow a string to be passed
         it.skip('should avoid capping when non-number prop is given to value prop', () => {
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: 2 });
+          wrapper.find('NumberInput').instance().setState({ value: 2 });
           wrapper.update();
           wrapper.setProps({ value: '', min: 1, max: 3 });
           // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
@@ -269,10 +251,7 @@ describe('NumberInput', () => {
         it('should avoid change the value upon setting props, unless there the value actually changes', () => {
           wrapper.setProps({ value: 1 });
           // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-          wrapper
-            .find('NumberInput')
-            .instance()
-            .setState({ value: 2 });
+          wrapper.find('NumberInput').instance().setState({ value: 2 });
           wrapper.update();
           wrapper.setProps({ value: 1 });
           // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
diff --git a/packages/react/src/components/NumberInput/NumberInput.js b/packages/react/src/components/NumberInput/NumberInput.js
index eb499c82bf92..fa8e9c0b0ebf 100644
--- a/packages/react/src/components/NumberInput/NumberInput.js
+++ b/packages/react/src/components/NumberInput/NumberInput.js
@@ -156,7 +156,7 @@ class NumberInput extends Component {
     helperText: '',
     light: false,
     allowEmpty: false,
-    translateWithId: id => defaultTranslations[id],
+    translateWithId: (id) => defaultTranslations[id],
   };
 
   static getDerivedStateFromProps({ min, max, value = 0 }, state) {
@@ -201,7 +201,7 @@ class NumberInput extends Component {
     this.state = { value };
   }
 
-  handleChange = evt => {
+  handleChange = (evt) => {
     const { disabled, onChange } = this.props;
     if (!disabled) {
       evt.persist();
@@ -259,7 +259,7 @@ class NumberInput extends Component {
    * Preserves the DOM node ref of `<input>`.
    * @param {HTMLInputElement} ref The DOM node ref of `<input>`.
    */
-  _handleInputRef = ref => {
+  _handleInputRef = (ref) => {
     this._inputRef = ref;
   };
 
@@ -387,7 +387,7 @@ class NumberInput extends Component {
                     <button
                       className={`${prefix}--number__control-btn down-icon`}
                       {...buttonProps}
-                      onClick={evt => this.handleArrowClick(evt, 'down')}
+                      onClick={(evt) => this.handleArrowClick(evt, 'down')}
                       title={decrementNumLabel}
                       aria-label={decrementNumLabel || iconDescription}
                       aria-live="polite"
@@ -404,7 +404,7 @@ class NumberInput extends Component {
                     <button
                       className={`${prefix}--number__control-btn up-icon`}
                       {...buttonProps}
-                      onClick={evt => this.handleArrowClick(evt, 'up')}
+                      onClick={(evt) => this.handleArrowClick(evt, 'up')}
                       title={incrementNumLabel}
                       aria-label={incrementNumLabel || iconDescription}
                       aria-live="polite"
@@ -436,7 +436,7 @@ class NumberInput extends Component {
                     <button
                       className={`${prefix}--number__control-btn up-icon`}
                       {...buttonProps}
-                      onClick={evt => this.handleArrowClick(evt, 'up')}
+                      onClick={(evt) => this.handleArrowClick(evt, 'up')}
                       title={incrementNumLabel || iconDescription}
                       aria-label={incrementNumLabel || iconDescription}
                       aria-live="polite"
@@ -446,7 +446,7 @@ class NumberInput extends Component {
                     <button
                       className={`${prefix}--number__control-btn down-icon`}
                       {...buttonProps}
-                      onClick={evt => this.handleArrowClick(evt, 'down')}
+                      onClick={(evt) => this.handleArrowClick(evt, 'down')}
                       title={decrementNumLabel || iconDescription}
                       aria-label={decrementNumLabel || iconDescription}
                       aria-live="polite"
diff --git a/packages/react/src/components/OverflowMenu/OverflowMenu-test.js b/packages/react/src/components/OverflowMenu/OverflowMenu-test.js
index 1864d60a1c7c..b827536d2c16 100644
--- a/packages/react/src/components/OverflowMenu/OverflowMenu-test.js
+++ b/packages/react/src/components/OverflowMenu/OverflowMenu-test.js
@@ -128,10 +128,7 @@ describe('OverflowMenu', () => {
         </OverflowMenu>
       );
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('OverflowMenu').instance().setState({ open: true });
       rootWrapper.update();
       const list = rootWrapper.find('ul');
       expect(list.length).toEqual(1);
@@ -147,10 +144,7 @@ describe('OverflowMenu', () => {
         </OverflowMenu>
       );
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('OverflowMenu').instance().setState({ open: true });
       rootWrapper.update();
       expect(rootWrapper.find('button.test-child').length).toEqual(2);
     });
@@ -160,10 +154,7 @@ describe('OverflowMenu', () => {
       const openClass = `${prefix}--overflow-menu-options--open`;
       expect(rootWrapper.find('ul').length).toEqual(0);
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('OverflowMenu').instance().setState({ open: true });
       rootWrapper.update();
       expect(rootWrapper.find('ul').hasClass(openClass)).not.toEqual(false);
     });
@@ -187,10 +178,7 @@ describe('OverflowMenu', () => {
       const menu = rootWrapper.childAt(0);
 
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('OverflowMenu').instance().setState({ open: true });
 
       menu.simulate('keydown', { which: spaceKey });
       // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
@@ -230,10 +218,7 @@ describe('OverflowMenu', () => {
       ).not.toEqual(true);
 
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('OverflowMenu').instance().setState({ open: true });
 
       rootWrapper
         .find('ClickListener')
@@ -250,10 +235,7 @@ describe('OverflowMenu', () => {
       const rootWrapper = mount(<OverflowMenu />);
 
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('OverflowMenu').instance().setState({ open: true });
 
       // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
       expect(rootWrapper.find('OverflowMenu').instance().state.open).toEqual(
@@ -298,10 +280,7 @@ describe('OverflowMenu', () => {
       const wrapper = mount(<OverflowMenu />);
       wrapper.setProps({ open: true });
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      wrapper
-        .find('OverflowMenu')
-        .instance()
-        .setState({ open: false });
+      wrapper.find('OverflowMenu').instance().setState({ open: false });
       wrapper.update();
       wrapper.setProps({ open: true });
       // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
diff --git a/packages/react/src/components/OverflowMenu/OverflowMenu.js b/packages/react/src/components/OverflowMenu/OverflowMenu.js
index c5104ffbb45a..5b83b9bd913f 100644
--- a/packages/react/src/components/OverflowMenu/OverflowMenu.js
+++ b/packages/react/src/components/OverflowMenu/OverflowMenu.js
@@ -277,21 +277,21 @@ class OverflowMenu extends Component {
     }
   }
 
-  handleClick = evt => {
+  handleClick = (evt) => {
     if (!this._menuBody || !this._menuBody.contains(evt.target)) {
       this.setState({ open: !this.state.open });
       this.props.onClick(evt);
     }
   };
 
-  handleKeyDown = evt => {
+  handleKeyDown = (evt) => {
     if (keyCodeMatches(evt, [keys.ArrowDown])) {
       this.setState({ open: !this.state.open });
       this.props.onClick(evt);
     }
   };
 
-  handleKeyPress = evt => {
+  handleKeyPress = (evt) => {
     if (
       this.state.open &&
       keyCodeMatches(evt, [
@@ -312,7 +312,7 @@ class OverflowMenu extends Component {
     }
   };
 
-  handleClickOutside = evt => {
+  handleClickOutside = (evt) => {
     if (
       this.state.open &&
       (!this._menuBody || !this._menuBody.contains(evt.target))
@@ -380,7 +380,7 @@ class OverflowMenu extends Component {
    * @param {Element} menuBody The DOM element of the menu body.
    * @private
    */
-  _bindMenuBody = menuBody => {
+  _bindMenuBody = (menuBody) => {
     if (!menuBody) {
       this._menuBody = menuBody;
     }
@@ -394,7 +394,7 @@ class OverflowMenu extends Component {
    * @param {Element} menuBody The DOM element of the menu body.
    * @private
    */
-  _handlePlace = menuBody => {
+  _handlePlace = (menuBody) => {
     if (menuBody) {
       this._menuBody = menuBody;
       const hasFocusin = 'onfocusin' in window;
@@ -402,7 +402,7 @@ class OverflowMenu extends Component {
       this._hFocusIn = on(
         menuBody.ownerDocument,
         focusinEventName,
-        event => {
+        (event) => {
           const { target } = event;
           const { current: triggerEl } = this._triggerRef;
           if (
@@ -485,7 +485,7 @@ class OverflowMenu extends Component {
         React.cloneElement(child, {
           closeMenu: this.closeMenu,
           handleOverflowMenuItemFocus: this.handleOverflowMenuItemFocus,
-          ref: e => {
+          ref: (e) => {
             this[`overflowMenuItem${index}`] = e;
           },
           index,
diff --git a/packages/react/src/components/OverflowMenuItem/OverflowMenuItem-test.js b/packages/react/src/components/OverflowMenuItem/OverflowMenuItem-test.js
index f4d6e6a0b85d..4c11880249a4 100644
--- a/packages/react/src/components/OverflowMenuItem/OverflowMenuItem-test.js
+++ b/packages/react/src/components/OverflowMenuItem/OverflowMenuItem-test.js
@@ -11,7 +11,7 @@ import { shallow } from 'enzyme';
 import { settings } from 'carbon-components';
 
 const { prefix } = settings;
-const shallowRender = props =>
+const shallowRender = (props) =>
   shallow(<OverflowMenuItem closeMenu={jest.fn()} {...props} />);
 
 describe('OverflowMenuItem', () => {
diff --git a/packages/react/src/components/OverflowMenuItem/OverflowMenuItem.js b/packages/react/src/components/OverflowMenuItem/OverflowMenuItem.js
index ec04d3885996..c00cb5b838f3 100644
--- a/packages/react/src/components/OverflowMenuItem/OverflowMenuItem.js
+++ b/packages/react/src/components/OverflowMenuItem/OverflowMenuItem.js
@@ -98,7 +98,7 @@ export default class OverflowMenuItem extends React.Component {
 
   overflowMenuItem = React.createRef();
 
-  setTabFocus = evt => {
+  setTabFocus = (evt) => {
     if (match(evt, keys.ArrowDown)) {
       this.props.handleOverflowMenuItemFocus({
         currentIndex: this.props.index,
@@ -113,7 +113,7 @@ export default class OverflowMenuItem extends React.Component {
     }
   };
 
-  handleClick = evt => {
+  handleClick = (evt) => {
     const { onClick, closeMenu } = this.props;
     onClick(evt);
     if (closeMenu) {
@@ -182,7 +182,7 @@ export default class OverflowMenuItem extends React.Component {
           className={overflowMenuBtnClasses}
           disabled={disabled}
           onClick={this.handleClick}
-          onKeyDown={evt => {
+          onKeyDown={(evt) => {
             this.setTabFocus(evt);
             onKeyDown(evt);
           }}
diff --git a/packages/react/src/components/Pagination/Pagination-story.js b/packages/react/src/components/Pagination/Pagination-story.js
index 530abba6fd37..147935fc9cf7 100644
--- a/packages/react/src/components/Pagination/Pagination-story.js
+++ b/packages/react/src/components/Pagination/Pagination-story.js
@@ -43,7 +43,7 @@ const props = () => ({
 
 storiesOf('Pagination', module)
   .addDecorator(withKnobs)
-  .addDecorator(story => <div style={{ maxWidth: '800px' }}>{story()}</div>)
+  .addDecorator((story) => <div style={{ maxWidth: '800px' }}>{story()}</div>)
   .add('Pagination', () => <Pagination {...props()} />, {
     info: {
       text: `
diff --git a/packages/react/src/components/Pagination/Pagination-test.js b/packages/react/src/components/Pagination/Pagination-test.js
index a29d01af2131..d78686619f61 100644
--- a/packages/react/src/components/Pagination/Pagination-test.js
+++ b/packages/react/src/components/Pagination/Pagination-test.js
@@ -25,7 +25,7 @@ describe('Pagination', () => {
 
     describe('icons', () => {
       const iconTypes = [CaretLeft16, CaretRight16];
-      const icons = pagination.findWhere(n => iconTypes.includes(n.type()));
+      const icons = pagination.findWhere((n) => iconTypes.includes(n.type()));
 
       it('should have 2 icons', () => {
         expect(icons.length).toEqual(2);
diff --git a/packages/react/src/components/Pagination/Pagination.js b/packages/react/src/components/Pagination/Pagination.js
index 8c94adef05ad..616f7b156528 100644
--- a/packages/react/src/components/Pagination/Pagination.js
+++ b/packages/react/src/components/Pagination/Pagination.js
@@ -143,7 +143,7 @@ export default class Pagination extends Component {
     isLastPage: false,
     pageInputDisabled: false,
     itemText: (min, max) => `${min}–${max} items`,
-    pageText: page => `page ${page}`,
+    pageText: (page) => `page ${page}`,
   };
 
   static getDerivedStateFromProps({ pageSizes, page, pageSize }, state) {
@@ -171,17 +171,17 @@ export default class Pagination extends Component {
         };
   }
 
-  handleSizeChange = evt => {
+  handleSizeChange = (evt) => {
     const pageSize = Number(evt.target.value);
     this.setState({ pageSize, page: 1 });
     this.props.onChange({ page: 1, pageSize });
   };
 
-  handlePageChange = evt => {
+  handlePageChange = (evt) => {
     this.setState({ page: evt.target.value });
   };
 
-  handlePageInputChange = evt => {
+  handlePageInputChange = (evt) => {
     const page = Number(evt.target.value);
     if (
       page > 0 &&
@@ -205,7 +205,7 @@ export default class Pagination extends Component {
     this.props.onChange({ page, pageSize: this.state.pageSize });
   };
 
-  renderSelectItems = total => {
+  renderSelectItems = (total) => {
     let counter = 1;
     let itemArr = [];
     while (counter <= total) {
@@ -280,7 +280,7 @@ export default class Pagination extends Component {
             inline
             onChange={this.handleSizeChange}
             value={statePageSize}>
-            {pageSizes.map(size => (
+            {pageSizes.map((size) => (
               <SelectItem key={size} value={size} text={String(size)} />
             ))}
           </Select>
diff --git a/packages/react/src/components/Pagination/Unstable_Pagination/PageSelector.js b/packages/react/src/components/Pagination/Unstable_Pagination/PageSelector.js
index 87ea3244ac5b..2156959d16af 100644
--- a/packages/react/src/components/Pagination/Unstable_Pagination/PageSelector.js
+++ b/packages/react/src/components/Pagination/Unstable_Pagination/PageSelector.js
@@ -27,7 +27,7 @@ function PageSelector({
   const namespace = `${prefix}--unstable-pagination__page-selector`;
   const instanceId = `${namespace}__select-${getInstanceId()}`;
 
-  const renderPages = total => {
+  const renderPages = (total) => {
     const pages = [];
     for (let counter = 1; counter <= total; counter += 1) {
       pages.push(
diff --git a/packages/react/src/components/Pagination/Unstable_Pagination/Pagination-story.js b/packages/react/src/components/Pagination/Unstable_Pagination/Pagination-story.js
index 70542e7575af..05444a687958 100644
--- a/packages/react/src/components/Pagination/Unstable_Pagination/Pagination-story.js
+++ b/packages/react/src/components/Pagination/Unstable_Pagination/Pagination-story.js
@@ -40,7 +40,7 @@ const props = () => ({
 
 storiesOf('UNSTABLE Pagination', module)
   .addDecorator(withKnobs)
-  .addDecorator(story => <div style={{ width: '800px' }}>{story()}</div>)
+  .addDecorator((story) => <div style={{ width: '800px' }}>{story()}</div>)
   .add(
     'with a page selector',
     () => (
@@ -52,7 +52,7 @@ storiesOf('UNSTABLE Pagination', module)
           <PageSelector
             currentPage={currentPage}
             id="select-1"
-            onChange={event => onSetPage(event.target.value)}
+            onChange={(event) => onSetPage(event.target.value)}
             totalPages={totalPages}
           />
         )}
diff --git a/packages/react/src/components/Pagination/Unstable_Pagination/Pagination.js b/packages/react/src/components/Pagination/Unstable_Pagination/Pagination.js
index 541bd4a4e2b4..6bb81385308c 100644
--- a/packages/react/src/components/Pagination/Unstable_Pagination/Pagination.js
+++ b/packages/react/src/components/Pagination/Unstable_Pagination/Pagination.js
@@ -69,9 +69,11 @@ function Unstable_Pagination({
               hideLabel
               noLabel
               inline
-              onChange={event => setCurrentPageSize(Number(event.target.value))}
+              onChange={(event) =>
+                setCurrentPageSize(Number(event.target.value))
+              }
               value={currentPageSize}>
-              {pageSizes.map(size => (
+              {pageSizes.map((size) => (
                 <SelectItem key={size} value={size} text={String(size)} />
               ))}
             </Select>
@@ -184,7 +186,7 @@ Unstable_Pagination.defaultProps = {
   pageRangeText: (current, total) => `${current} of ${total} pages`,
   pageSize: 10,
   pageSizes: undefined,
-  pageText: page => `page ${page}`,
+  pageText: (page) => `page ${page}`,
   pagesUnknown: false,
   totalItems: undefined,
 };
diff --git a/packages/react/src/components/PrimaryButton/PrimaryButton.js b/packages/react/src/components/PrimaryButton/PrimaryButton.js
index 1af27a9aff91..26f1acf50043 100644
--- a/packages/react/src/components/PrimaryButton/PrimaryButton.js
+++ b/packages/react/src/components/PrimaryButton/PrimaryButton.js
@@ -8,6 +8,6 @@
 import React from 'react';
 import Button from '../Button';
 
-const PrimaryButton = props => <Button kind="primary" {...props} />;
+const PrimaryButton = (props) => <Button kind="primary" {...props} />;
 
 export default PrimaryButton;
diff --git a/packages/react/src/components/ProgressIndicator/ProgressIndicator-test.js b/packages/react/src/components/ProgressIndicator/ProgressIndicator-test.js
index f470f95a11a5..8eeb59e570f5 100644
--- a/packages/react/src/components/ProgressIndicator/ProgressIndicator-test.js
+++ b/packages/react/src/components/ProgressIndicator/ProgressIndicator-test.js
@@ -85,11 +85,7 @@ describe('ProgressIndicator', () => {
       const mockOnChange = jest.fn();
 
       mountedList.setProps({ onChange: mockOnChange });
-      mountedList
-        .find(ProgressStep)
-        .at(0)
-        .find('button')
-        .simulate('click');
+      mountedList.find(ProgressStep).at(0).find('button').simulate('click');
       expect(mockOnChange).toHaveBeenCalledWith(0);
     });
 
@@ -105,30 +101,21 @@ describe('ProgressIndicator', () => {
       });
 
       it('should render with a label', () => {
-        expect(
-          mountedList
-            .find(ProgressStep)
-            .at(0)
-            .prop('label')
-        ).toEqual('label');
+        expect(mountedList.find(ProgressStep).at(0).prop('label')).toEqual(
+          'label'
+        );
       });
 
       it('should render with a description', () => {
         expect(
-          mountedList
-            .find(ProgressStep)
-            .at(0)
-            .prop('description')
+          mountedList.find(ProgressStep).at(0).prop('description')
         ).toEqual('Step 1: Getting Started with Node.js');
       });
 
       it('should render description in <title> node', () => {
-        expect(
-          mountedList
-            .find('ProgressStep title')
-            .at(0)
-            .text()
-        ).toEqual('Step 1: Getting Started with Node.js');
+        expect(mountedList.find('ProgressStep title').at(0).text()).toEqual(
+          'Step 1: Getting Started with Node.js'
+        );
       });
 
       describe('current', () => {
@@ -143,12 +130,9 @@ describe('ProgressIndicator', () => {
         });
 
         it('should render a current ProgressStep with correct props', () => {
-          expect(
-            mountedList
-              .find(ProgressStep)
-              .at(3)
-              .prop('current')
-          ).toBe(true);
+          expect(mountedList.find(ProgressStep).at(3).prop('current')).toBe(
+            true
+          );
         });
       });
 
@@ -163,12 +147,7 @@ describe('ProgressIndicator', () => {
           ).toEqual(true);
         });
         it('should render any completed ProgressSteps with correct props', () => {
-          expect(
-            list
-              .find(ProgressStep)
-              .at(0)
-              .prop('complete')
-          ).toBe(true);
+          expect(list.find(ProgressStep).at(0).prop('complete')).toBe(true);
         });
       });
 
@@ -183,12 +162,7 @@ describe('ProgressIndicator', () => {
           ).toEqual(true);
         });
         it('should render any incompleted ProgressSteps with correct props', () => {
-          expect(
-            list
-              .find(ProgressStep)
-              .at(5)
-              .prop('complete')
-          ).toBe(false);
+          expect(list.find(ProgressStep).at(5).prop('complete')).toBe(false);
         });
 
         it('should render any clickable ProgressSteps with correct classname', () => {
diff --git a/packages/react/src/components/ProgressIndicator/ProgressIndicator.js b/packages/react/src/components/ProgressIndicator/ProgressIndicator.js
index cff75ebbaf85..fe4bc9cd58d5 100644
--- a/packages/react/src/components/ProgressIndicator/ProgressIndicator.js
+++ b/packages/react/src/components/ProgressIndicator/ProgressIndicator.js
@@ -19,7 +19,7 @@ import { keys, matches } from '../../internal/keyboard';
 
 const { prefix } = settings;
 
-const defaultRenderLabel = props => <p {...props} />;
+const defaultRenderLabel = (props) => <p {...props} />;
 
 const defaultTranslations = {
   'carbon.progress-step.complete': 'Complete',
@@ -54,7 +54,7 @@ export function ProgressStep({
     [className]: className,
   });
 
-  const handleKeyDown = e => {
+  const handleKeyDown = (e) => {
     if (matches(e, [keys.Enter, keys.Space])) {
       onClick();
     }
diff --git a/packages/react/src/components/RadioButton/RadioButton-test.js b/packages/react/src/components/RadioButton/RadioButton-test.js
index 4635610b5513..c11cd7b27970 100644
--- a/packages/react/src/components/RadioButton/RadioButton-test.js
+++ b/packages/react/src/components/RadioButton/RadioButton-test.js
@@ -13,7 +13,7 @@ import { settings } from 'carbon-components';
 
 const { prefix } = settings;
 
-const render = props =>
+const render = (props) =>
   mount(
     <RadioButton
       {...props}
diff --git a/packages/react/src/components/RadioButton/RadioButton.js b/packages/react/src/components/RadioButton/RadioButton.js
index a1f92de9ba3e..82a38d6d2510 100644
--- a/packages/react/src/components/RadioButton/RadioButton.js
+++ b/packages/react/src/components/RadioButton/RadioButton.js
@@ -89,7 +89,7 @@ class RadioButton extends React.Component {
 
   uid = this.props.id || uid();
 
-  handleChange = evt => {
+  handleChange = (evt) => {
     this.props.onChange(this.props.value, this.props.name, evt);
   };
 
diff --git a/packages/react/src/components/RadioButtonGroup/RadioButtonGroup-test.js b/packages/react/src/components/RadioButtonGroup/RadioButtonGroup-test.js
index ca6f19d4151e..e17b8f6fbb37 100644
--- a/packages/react/src/components/RadioButtonGroup/RadioButtonGroup-test.js
+++ b/packages/react/src/components/RadioButtonGroup/RadioButtonGroup-test.js
@@ -48,26 +48,14 @@ describe('RadioButtonGroup', () => {
       });
 
       it('should set checked property based on defaultSelected prop', () => {
-        expect(
-          radioButton()
-            .last()
-            .props().checked
-        ).toEqual(true);
+        expect(radioButton().last().props().checked).toEqual(true);
       });
 
       it('should set checked property based on valueSelected prop', () => {
         wrapper.setProps({ valueSelected: 'male' });
-        expect(
-          radioButton()
-            .first()
-            .props().checked
-        ).toEqual(true);
+        expect(radioButton().first().props().checked).toEqual(true);
         wrapper.setProps({ valueSelected: 'female' });
-        expect(
-          radioButton()
-            .last()
-            .props().checked
-        ).toEqual(true);
+        expect(radioButton().last().props().checked).toEqual(true);
       });
 
       it('should set expected props on children', () => {
@@ -97,12 +85,7 @@ describe('RadioButtonGroup', () => {
     it('invoking onChange sets checked on correct child', () => {
       firstRadio.props().onChange(...args);
       wrapper.update();
-      expect(
-        wrapper
-          .find(RadioButton)
-          .first()
-          .props().checked
-      ).toEqual(true);
+      expect(wrapper.find(RadioButton).first().props().checked).toEqual(true);
     });
 
     it('should invoke onChange with correct arguments', () => {
diff --git a/packages/react/src/components/RadioButtonGroup/RadioButtonGroup.js b/packages/react/src/components/RadioButtonGroup/RadioButtonGroup.js
index 06f5cba4275d..4220ddfb9aab 100644
--- a/packages/react/src/components/RadioButtonGroup/RadioButtonGroup.js
+++ b/packages/react/src/components/RadioButtonGroup/RadioButtonGroup.js
@@ -82,7 +82,7 @@ export default class RadioButtonGroup extends React.Component {
   }
 
   getRadioButtons = () => {
-    const children = React.Children.map(this.props.children, radioButton => {
+    const children = React.Children.map(this.props.children, (radioButton) => {
       const { value, ...other } = radioButton.props;
       /* istanbul ignore if */
       if (typeof radioButton.props.checked !== 'undefined') {
diff --git a/packages/react/src/components/RadioTile/RadioTile-test.js b/packages/react/src/components/RadioTile/RadioTile-test.js
index 2bf6e4ad19c5..d1de3768ecf8 100644
--- a/packages/react/src/components/RadioTile/RadioTile-test.js
+++ b/packages/react/src/components/RadioTile/RadioTile-test.js
@@ -12,7 +12,7 @@ import { settings } from 'carbon-components';
 
 const { prefix } = settings;
 
-const render = props =>
+const render = (props) =>
   mount(
     <RadioButton
       {...props}
diff --git a/packages/react/src/components/Search/Search-test.js b/packages/react/src/components/Search/Search-test.js
index 3d480c20bcc8..9288a8432d2d 100644
--- a/packages/react/src/components/Search/Search-test.js
+++ b/packages/react/src/components/Search/Search-test.js
@@ -89,14 +89,8 @@ describe('Search', () => {
         });
 
         it('should have type="button"', () => {
-          const type1 = btns
-            .first()
-            .instance()
-            .getAttribute('type');
-          const type2 = btns
-            .last()
-            .instance()
-            .getAttribute('type');
+          const type1 = btns.first().instance().getAttribute('type');
+          const type2 = btns.last().instance().getAttribute('type');
           expect(type1).toEqual('button');
           expect(type2).toEqual('button');
         });
@@ -111,7 +105,7 @@ describe('Search', () => {
         it('renders two Icons', () => {
           wrapper.setProps({ size: undefined });
           const iconTypes = [Search16, Close20];
-          const icons = wrapper.findWhere(n => iconTypes.includes(n.type()));
+          const icons = wrapper.findWhere((n) => iconTypes.includes(n.type()));
           expect(icons.length).toEqual(2);
         });
       });
@@ -146,7 +140,7 @@ describe('Search', () => {
 
       it('renders two Icons', () => {
         const iconTypes = [Search16, Close16];
-        const icons = large.findWhere(n => iconTypes.includes(n.type()));
+        const icons = large.findWhere((n) => iconTypes.includes(n.type()));
         expect(icons.length).toEqual(2);
       });
     });
@@ -180,7 +174,7 @@ describe('Search', () => {
 
       it('renders two Icons', () => {
         const iconTypes = [Search16, Close20];
-        const icons = wrapper.findWhere(n => iconTypes.includes(n.type()));
+        const icons = wrapper.findWhere((n) => iconTypes.includes(n.type()));
         expect(icons.length).toEqual(2);
       });
     });
diff --git a/packages/react/src/components/Search/Search.js b/packages/react/src/components/Search/Search.js
index 5fea9810920c..5e83cc34665d 100644
--- a/packages/react/src/components/Search/Search.js
+++ b/packages/react/src/components/Search/Search.js
@@ -103,7 +103,7 @@ export default class Search extends Component {
         };
   }
 
-  clearInput = evt => {
+  clearInput = (evt) => {
     if (!this.props.value) {
       this.input.value = '';
       this.props.onChange(evt);
@@ -119,7 +119,7 @@ export default class Search extends Component {
     this.setState({ hasContent: false }, () => this.input.focus());
   };
 
-  handleChange = evt => {
+  handleChange = (evt) => {
     this.setState({
       hasContent: evt.target.value !== '',
     });
@@ -133,9 +133,7 @@ export default class Search extends Component {
       type,
       id = (this._inputId =
         this._inputId ||
-        `search__input__id_${Math.random()
-          .toString(36)
-          .substr(2)}`),
+        `search__input__id_${Math.random().toString(36).substr(2)}`),
       placeHolderText,
       labelText,
       closeButtonLabelText,
@@ -178,7 +176,7 @@ export default class Search extends Component {
           id={id}
           placeholder={placeHolderText}
           onChange={this.handleChange}
-          ref={input => {
+          ref={(input) => {
             this.input = input;
           }}
         />
diff --git a/packages/react/src/components/SecondaryButton/SecondaryButton.js b/packages/react/src/components/SecondaryButton/SecondaryButton.js
index b108b512de8a..0597016959f2 100644
--- a/packages/react/src/components/SecondaryButton/SecondaryButton.js
+++ b/packages/react/src/components/SecondaryButton/SecondaryButton.js
@@ -8,6 +8,6 @@
 import React from 'react';
 import Button from '../Button';
 
-const SecondaryButton = props => <Button kind="secondary" {...props} />;
+const SecondaryButton = (props) => <Button kind="secondary" {...props} />;
 
 export default SecondaryButton;
diff --git a/packages/react/src/components/Slider/Slider-test.js b/packages/react/src/components/Slider/Slider-test.js
index ab16263cd863..e21bc4a0bf72 100644
--- a/packages/react/src/components/Slider/Slider-test.js
+++ b/packages/react/src/components/Slider/Slider-test.js
@@ -15,7 +15,7 @@ import { settings } from 'carbon-components';
 
 jest.mock('lodash.throttle');
 
-throttle.mockImplementation(fn => Object.assign(fn, { throttled: true }));
+throttle.mockImplementation((fn) => Object.assign(fn, { throttled: true }));
 
 const { prefix } = settings;
 describe('Slider', () => {
@@ -98,16 +98,10 @@ describe('Slider', () => {
         <Slider min={0} minLabel="min" max={100} maxLabel="max" value={0} />
       );
       expect(
-        wrapper
-          .find(`.${prefix}--slider__range-label`)
-          .first()
-          .text()
+        wrapper.find(`.${prefix}--slider__range-label`).first().text()
       ).toBe('0min');
       expect(
-        wrapper
-          .find(`.${prefix}--slider__range-label`)
-          .last()
-          .text()
+        wrapper.find(`.${prefix}--slider__range-label`).last().text()
       ).toBe('100max');
     });
 
@@ -123,16 +117,10 @@ describe('Slider', () => {
         />
       );
       expect(
-        wrapper
-          .find(`.${prefix}--slider__range-label`)
-          .first()
-          .text()
+        wrapper.find(`.${prefix}--slider__range-label`).first().text()
       ).toBe('0-min');
       expect(
-        wrapper
-          .find(`.${prefix}--slider__range-label`)
-          .last()
-          .text()
+        wrapper.find(`.${prefix}--slider__range-label`).last().text()
       ).toBe('100-max');
     });
   });
diff --git a/packages/react/src/components/Slider/Slider.js b/packages/react/src/components/Slider/Slider.js
index 50144e931fa8..5e0a3fbbab28 100644
--- a/packages/react/src/components/Slider/Slider.js
+++ b/packages/react/src/components/Slider/Slider.js
@@ -238,19 +238,19 @@ export default class Slider extends PureComponent {
    *
    * @param {Event} evt The event.
    */
-  onDragStart = evt => {
+  onDragStart = (evt) => {
     // Do nothing if component is disabled
     if (this.props.disabled) {
       return;
     }
 
     // Register drag stop handlers
-    DRAG_STOP_EVENT_TYPES.forEach(element => {
+    DRAG_STOP_EVENT_TYPES.forEach((element) => {
       this.element.ownerDocument.addEventListener(element, this.onDragStop);
     });
 
     // Register drag handlers
-    DRAG_EVENT_TYPES.forEach(element => {
+    DRAG_EVENT_TYPES.forEach((element) => {
       this.element.ownerDocument.addEventListener(element, this.onDrag);
     });
 
@@ -270,12 +270,12 @@ export default class Slider extends PureComponent {
     }
 
     // Remove drag stop handlers
-    DRAG_STOP_EVENT_TYPES.forEach(element => {
+    DRAG_STOP_EVENT_TYPES.forEach((element) => {
       this.element.ownerDocument.removeEventListener(element, this.onDragStop);
     });
 
     // Remove drag handlers
-    DRAG_EVENT_TYPES.forEach(element => {
+    DRAG_EVENT_TYPES.forEach((element) => {
       this.element.ownerDocument.removeEventListener(element, this.onDrag);
     });
 
@@ -289,7 +289,7 @@ export default class Slider extends PureComponent {
    *
    * @param {Event} evt The event.
    */
-  _onDrag = evt => {
+  _onDrag = (evt) => {
     // Do nothing if component is disabled or we have no event
     if (this.props.disabled || !evt) {
       return;
@@ -328,7 +328,7 @@ export default class Slider extends PureComponent {
    *
    * @param {Event} evt The event.
    */
-  onKeyDown = evt => {
+  onKeyDown = (evt) => {
     // Do nothing if component is disabled or we don't have a valid event
     if (this.props.disabled || !('which' in evt)) {
       return;
@@ -371,7 +371,7 @@ export default class Slider extends PureComponent {
    *
    * @param {Event} evt The event.
    */
-  onChange = evt => {
+  onChange = (evt) => {
     // Do nothing if component is disabled
     if (this.props.disabled) {
       return;
@@ -464,9 +464,7 @@ export default class Slider extends PureComponent {
       hideTextInput,
       id = (this.inputId =
         this.inputId ||
-        `__carbon-slider_${Math.random()
-          .toString(36)
-          .substr(2)}`),
+        `__carbon-slider_${Math.random().toString(36).substr(2)}`),
       min,
       minLabel,
       max,
@@ -528,7 +526,7 @@ export default class Slider extends PureComponent {
           </span>
           <div
             className={sliderClasses}
-            ref={node => {
+            ref={(node) => {
               this.element = node;
             }}
             onMouseDown={this.onDragStart}
@@ -549,7 +547,7 @@ export default class Slider extends PureComponent {
             />
             <div
               className={`${prefix}--slider__track`}
-              ref={node => {
+              ref={(node) => {
                 this.track = node;
               }}
             />
diff --git a/packages/react/src/components/StructuredList/StructuredList-story.js b/packages/react/src/components/StructuredList/StructuredList-story.js
index 86cb88cbb851..4fd704405e7f 100644
--- a/packages/react/src/components/StructuredList/StructuredList-story.js
+++ b/packages/react/src/components/StructuredList/StructuredList-story.js
@@ -68,7 +68,7 @@ storiesOf('StructuredList', module)
   .add(
     'Selection',
     () => {
-      const structuredListBodyRowGenerator = numRows => {
+      const structuredListBodyRowGenerator = (numRows) => {
         return Array.apply(null, Array(numRows)).map((n, i) => (
           <StructuredListRow label key={`row-${i}`}>
             <StructuredListCell>Row {i}</StructuredListCell>
diff --git a/packages/react/src/components/Switch/Switch.js b/packages/react/src/components/Switch/Switch.js
index 57ce145a4653..fb2b1f92b343 100644
--- a/packages/react/src/components/Switch/Switch.js
+++ b/packages/react/src/components/Switch/Switch.js
@@ -24,12 +24,12 @@ const Switch = React.forwardRef(function Switch(props, tabRef) {
     ...other
   } = props;
 
-  const handleClick = e => {
+  const handleClick = (e) => {
     e.preventDefault();
     onClick({ index, name, text });
   };
 
-  const handleKeyDown = event => {
+  const handleKeyDown = (event) => {
     const key = event.key || event.which;
 
     onKeyDown({ index, name, text, key });
diff --git a/packages/react/src/components/Tab/Tab.js b/packages/react/src/components/Tab/Tab.js
index 43ef38b5c72c..352a49fa5b72 100644
--- a/packages/react/src/components/Tab/Tab.js
+++ b/packages/react/src/components/Tab/Tab.js
@@ -136,7 +136,7 @@ export default class Tab extends React.Component {
       className: `${prefix}--tabs__nav-link`,
       href,
       tabIndex: !disabled ? tabIndex : -1,
-      ref: e => {
+      ref: (e) => {
         this.tabAnchor = e;
       },
     };
@@ -146,14 +146,14 @@ export default class Tab extends React.Component {
         {...other}
         tabIndex={-1}
         className={classes}
-        onClick={evt => {
+        onClick={(evt) => {
           if (disabled) {
             return;
           }
           handleTabClick(index, evt);
           onClick(evt);
         }}
-        onKeyDown={evt => {
+        onKeyDown={(evt) => {
           if (disabled) {
             return;
           }
diff --git a/packages/react/src/components/TabContent/TabContent.js b/packages/react/src/components/TabContent/TabContent.js
index d190b844dac6..6ab359ba3ff4 100644
--- a/packages/react/src/components/TabContent/TabContent.js
+++ b/packages/react/src/components/TabContent/TabContent.js
@@ -12,7 +12,7 @@ import { settings } from 'carbon-components';
 
 const { prefix } = settings;
 
-const TabContent = props => {
+const TabContent = (props) => {
   const { className, selected, children, ...other } = props;
   const tabContentClasses = classNames(`${prefix}--tab-content`, {
     [className]: className,
diff --git a/packages/react/src/components/Tabs/Tabs-test.js b/packages/react/src/components/Tabs/Tabs-test.js
index 1a6e5efdb935..69c0937e5ed9 100644
--- a/packages/react/src/components/Tabs/Tabs-test.js
+++ b/packages/react/src/components/Tabs/Tabs-test.js
@@ -15,7 +15,7 @@ import TabsSkeleton from '../Tabs/Tabs.Skeleton';
 
 const { prefix } = settings;
 
-window.matchMedia = jest.fn().mockImplementation(query => ({
+window.matchMedia = jest.fn().mockImplementation((query) => ({
   matches: true,
   media: query,
   onchange: null,
@@ -53,12 +53,9 @@ describe('Tabs', () => {
       });
 
       it('renders expected classes on wrapping <div> by default', () => {
-        expect(
-          wrapper
-            .find('div')
-            .first()
-            .hasClass(`${prefix}--tabs`)
-        ).toBe(true);
+        expect(wrapper.find('div').first().hasClass(`${prefix}--tabs`)).toBe(
+          true
+        );
       });
 
       it('supports container variant', () => {
@@ -164,18 +161,12 @@ describe('Tabs', () => {
     });
 
     it('renders hidden props with boolean value', () => {
-      const hiddenProp = wrapper
-        .find('TabContent')
-        .first()
-        .props().hidden;
+      const hiddenProp = wrapper.find('TabContent').first().props().hidden;
       expect(typeof hiddenProp).toBe('boolean');
     });
 
     it('renders selected props with boolean value', () => {
-      const selectedProp = wrapper
-        .find('TabContent')
-        .first()
-        .props().hidden;
+      const selectedProp = wrapper.find('TabContent').first().props().hidden;
       expect(typeof selectedProp).toBe('boolean');
     });
   });
@@ -422,10 +413,7 @@ describe('selection change', () => {
   );
 
   it('updates selected state when selected prop changes', () => {
-    wrapper
-      .find('.secondTab')
-      .last()
-      .simulate('click');
+    wrapper.find('.secondTab').last().simulate('click');
     expect(wrapper.props().onSelectionChange).toHaveBeenCalledWith(1);
   });
 });
diff --git a/packages/react/src/components/Tabs/Tabs.js b/packages/react/src/components/Tabs/Tabs.js
index 70442ac3843b..92522e933054 100644
--- a/packages/react/src/components/Tabs/Tabs.js
+++ b/packages/react/src/components/Tabs/Tabs.js
@@ -121,7 +121,7 @@ export default class Tabs extends React.Component {
   }
 
   getTabs() {
-    return React.Children.map(this.props.children, tab => tab);
+    return React.Children.map(this.props.children, (tab) => tab);
   }
 
   getEnabledTabs = () =>
@@ -142,7 +142,7 @@ export default class Tabs extends React.Component {
   };
 
   // following functions (handle*) are Props on Tab.js, see Tab.js for parameters
-  handleTabClick = onSelectionChange => {
+  handleTabClick = (onSelectionChange) => {
     return (index, evt) => {
       evt.preventDefault();
 
@@ -153,7 +153,7 @@ export default class Tabs extends React.Component {
     };
   };
 
-  getDirection = evt => {
+  getDirection = (evt) => {
     if (match(evt, keys.ArrowLeft)) {
       return -1;
     }
@@ -176,7 +176,7 @@ export default class Tabs extends React.Component {
     return enabledTabs[nextIndexLooped];
   };
 
-  handleTabKeyDown = onSelectionChange => {
+  handleTabKeyDown = (onSelectionChange) => {
     return (index, evt) => {
       if (matches(evt, [keys.Enter, keys.Space])) {
         this.selectTabAt(index, onSelectionChange);
@@ -252,7 +252,7 @@ export default class Tabs extends React.Component {
         selected: index === this.state.selected,
         handleTabClick: this.handleTabClick(onSelectionChange),
         tabIndex,
-        ref: e => {
+        ref: (e) => {
           this.setTabAt(index, e);
         },
         handleTabKeyDown: this.handleTabKeyDown(onSelectionChange),
@@ -261,7 +261,7 @@ export default class Tabs extends React.Component {
       return newTab;
     });
 
-    const tabContentWithProps = React.Children.map(tabsWithProps, tab => {
+    const tabContentWithProps = React.Children.map(tabsWithProps, (tab) => {
       const {
         id: tabId,
         children,
diff --git a/packages/react/src/components/Tag/Tag.js b/packages/react/src/components/Tag/Tag.js
index 2161bf702d13..2889287d0dbe 100644
--- a/packages/react/src/components/Tag/Tag.js
+++ b/packages/react/src/components/Tag/Tag.js
@@ -45,7 +45,7 @@ const Tag = ({
     [`${prefix}--tag--filter`]: filter,
     [`${prefix}--tag--${type}`]: type,
   });
-  const handleClose = event => {
+  const handleClose = (event) => {
     if (onClose) {
       event.stopPropagation();
       onClose(event);
diff --git a/packages/react/src/components/TextArea/TextArea.js b/packages/react/src/components/TextArea/TextArea.js
index 90ff47740b9c..6895837d8d34 100644
--- a/packages/react/src/components/TextArea/TextArea.js
+++ b/packages/react/src/components/TextArea/TextArea.js
@@ -31,12 +31,12 @@ const TextArea = React.forwardRef(function TextArea(
 ) {
   const textareaProps = {
     id,
-    onChange: evt => {
+    onChange: (evt) => {
       if (!other.disabled) {
         onChange(evt);
       }
     },
-    onClick: evt => {
+    onClick: (evt) => {
       if (!other.disabled) {
         onClick(evt);
       }
diff --git a/packages/react/src/components/TextInput/ControlledPasswordInput.js b/packages/react/src/components/TextInput/ControlledPasswordInput.js
index c3fecd4cdf2d..031fb0cd4435 100644
--- a/packages/react/src/components/TextInput/ControlledPasswordInput.js
+++ b/packages/react/src/components/TextInput/ControlledPasswordInput.js
@@ -43,12 +43,12 @@ const ControlledPasswordInput = React.forwardRef(
     );
     const sharedTextInputProps = {
       id,
-      onChange: evt => {
+      onChange: (evt) => {
         if (!other.disabled) {
           onChange(evt);
         }
       },
-      onClick: evt => {
+      onClick: (evt) => {
         if (!other.disabled) {
           onClick(evt);
         }
diff --git a/packages/react/src/components/TextInput/PasswordInput.js b/packages/react/src/components/TextInput/PasswordInput.js
index 96bd8ba91176..3831c6941d99 100644
--- a/packages/react/src/components/TextInput/PasswordInput.js
+++ b/packages/react/src/components/TextInput/PasswordInput.js
@@ -45,12 +45,12 @@ const PasswordInput = React.forwardRef(function PasswordInput(
   );
   const sharedTextInputProps = {
     id,
-    onChange: evt => {
+    onChange: (evt) => {
       if (!other.disabled) {
         onChange(evt);
       }
     },
-    onClick: evt => {
+    onClick: (evt) => {
       if (!other.disabled) {
         onClick(evt);
       }
diff --git a/packages/react/src/components/TextInput/TextInput.js b/packages/react/src/components/TextInput/TextInput.js
index b842d3d94caa..3609d13e9740 100644
--- a/packages/react/src/components/TextInput/TextInput.js
+++ b/packages/react/src/components/TextInput/TextInput.js
@@ -43,12 +43,12 @@ const TextInput = React.forwardRef(function TextInput(
   });
   const sharedTextInputProps = {
     id,
-    onChange: evt => {
+    onChange: (evt) => {
       if (!other.disabled) {
         onChange(evt);
       }
     },
-    onClick: evt => {
+    onClick: (evt) => {
       if (!other.disabled) {
         onClick(evt);
       }
diff --git a/packages/react/src/components/Tile/Tile-test.js b/packages/react/src/components/Tile/Tile-test.js
index 5065aeb9e91d..cf15de3a33ca 100644
--- a/packages/react/src/components/Tile/Tile-test.js
+++ b/packages/react/src/components/Tile/Tile-test.js
@@ -273,7 +273,7 @@ describe('Tile', () => {
 
     it('ignores allows click events to be ignored using onBeforeClick', () => {
       wrapper.setProps({
-        onBeforeClick: evt => evt.target.tagName.toLowerCase() !== 'a', // ignore link clicks
+        onBeforeClick: (evt) => evt.target.tagName.toLowerCase() !== 'a', // ignore link clicks
       });
       expect(wrapper.state().expanded).toEqual(false);
       wrapper.simulate('click');
diff --git a/packages/react/src/components/Tile/Tile.js b/packages/react/src/components/Tile/Tile.js
index 0c94ed6a9cf8..d433613841e4 100644
--- a/packages/react/src/components/Tile/Tile.js
+++ b/packages/react/src/components/Tile/Tile.js
@@ -96,7 +96,7 @@ export class ClickableTile extends Component {
     light: false,
   };
 
-  handleClick = evt => {
+  handleClick = (evt) => {
     evt.persist();
     this.setState(
       {
@@ -108,7 +108,7 @@ export class ClickableTile extends Component {
     );
   };
 
-  handleKeyDown = evt => {
+  handleKeyDown = (evt) => {
     evt.persist();
     if (matches(evt, [keys.Enter, keys.Space])) {
       this.setState(
@@ -257,7 +257,7 @@ export class SelectableTile extends Component {
         };
   }
 
-  handleClick = evt => {
+  handleClick = (evt) => {
     evt.preventDefault();
     evt.persist();
     this.setState(
@@ -271,7 +271,7 @@ export class SelectableTile extends Component {
     );
   };
 
-  handleKeyDown = evt => {
+  handleKeyDown = (evt) => {
     evt.persist();
     if (matches(evt, [keys.Enter, keys.Space])) {
       evt.preventDefault();
@@ -289,7 +289,7 @@ export class SelectableTile extends Component {
     }
   };
 
-  handleOnChange = event => {
+  handleOnChange = (event) => {
     this.setState({ selected: event.target.checked });
     this.props.onChange(event);
   };
@@ -326,7 +326,7 @@ export class SelectableTile extends Component {
     return (
       <>
         <input
-          ref={input => {
+          ref={(input) => {
             this.input = input;
           }}
           tabIndex={-1}
@@ -463,7 +463,7 @@ export class ExpandableTile extends Component {
     }
   };
 
-  componentDidUpdate = prevProps => {
+  componentDidUpdate = (prevProps) => {
     if (prevProps.expanded !== this.props.expanded) this.setMaxHeight();
   };
 
@@ -477,7 +477,7 @@ export class ExpandableTile extends Component {
     }
   };
 
-  handleClick = evt => {
+  handleClick = (evt) => {
     if (!this.props.onBeforeClick(evt)) return;
     evt.persist();
     this.setState(
@@ -491,7 +491,7 @@ export class ExpandableTile extends Component {
     );
   };
 
-  handleKeyDown = evt => {
+  handleKeyDown = (evt) => {
     if (matches(evt, [keys.Enter, keys.Space])) {
       evt.persist();
       this.setState(
@@ -548,7 +548,7 @@ export class ExpandableTile extends Component {
     return (
       // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
       <button
-        ref={tile => {
+        ref={(tile) => {
           this.tile = tile;
         }}
         style={tileStyle}
@@ -559,11 +559,11 @@ export class ExpandableTile extends Component {
         onClick={this.handleClick}
         tabIndex={tabIndex}>
         <div
-          ref={tileContent => {
+          ref={(tileContent) => {
             this.tileContent = tileContent;
           }}>
           <div
-            ref={aboveTheFold => {
+            ref={(aboveTheFold) => {
               this.aboveTheFold = aboveTheFold;
             }}
             className={`${prefix}--tile-content`}>
diff --git a/packages/react/src/components/TileGroup/TileGroup-test.js b/packages/react/src/components/TileGroup/TileGroup-test.js
index 72200a1dcc33..afe2d5ff13a6 100644
--- a/packages/react/src/components/TileGroup/TileGroup-test.js
+++ b/packages/react/src/components/TileGroup/TileGroup-test.js
@@ -45,26 +45,14 @@ describe('TileGroup', () => {
       });
 
       it('should set checked property based on defaultSelected prop', () => {
-        expect(
-          tileButton()
-            .last()
-            .props().checked
-        ).toEqual(true);
+        expect(tileButton().last().props().checked).toEqual(true);
       });
 
       it('should set checked property based on valueSelected prop', () => {
         wrapper.setProps({ valueSelected: 'male' });
-        expect(
-          tileButton()
-            .first()
-            .props().checked
-        ).toEqual(true);
+        expect(tileButton().first().props().checked).toEqual(true);
         wrapper.setProps({ valueSelected: 'female' });
-        expect(
-          tileButton()
-            .last()
-            .props().checked
-        ).toEqual(true);
+        expect(tileButton().last().props().checked).toEqual(true);
       });
 
       it('should set expected props on children', () => {
@@ -94,12 +82,7 @@ describe('TileGroup', () => {
     it('invoking onChange sets checked on correct child', () => {
       firstRadio.props().onChange(...args);
       wrapper.update();
-      expect(
-        wrapper
-          .find(RadioTile)
-          .first()
-          .props().checked
-      ).toEqual(true);
+      expect(wrapper.find(RadioTile).first().props().checked).toEqual(true);
     });
 
     it('should invoke onChange with correct arguments', () => {
diff --git a/packages/react/src/components/TileGroup/TileGroup.js b/packages/react/src/components/TileGroup/TileGroup.js
index 7a9400f9a2d0..da05c73ca142 100644
--- a/packages/react/src/components/TileGroup/TileGroup.js
+++ b/packages/react/src/components/TileGroup/TileGroup.js
@@ -78,7 +78,7 @@ export default class TileGroup extends React.Component {
 
   getRadioTiles = () => {
     const childrenArray = React.Children.toArray(this.props.children);
-    const children = childrenArray.map(tileRadio => {
+    const children = childrenArray.map((tileRadio) => {
       const { value, ...other } = tileRadio.props;
       /* istanbul ignore if */
       if (typeof tileRadio.props.checked !== 'undefined') {
@@ -111,7 +111,7 @@ export default class TileGroup extends React.Component {
     }
   };
 
-  renderLegend = legend => {
+  renderLegend = (legend) => {
     if (legend) {
       return <legend>{legend}</legend>;
     }
diff --git a/packages/react/src/components/TimePicker/TimePicker.js b/packages/react/src/components/TimePicker/TimePicker.js
index af0f11da95fa..b659830fc11d 100644
--- a/packages/react/src/components/TimePicker/TimePicker.js
+++ b/packages/react/src/components/TimePicker/TimePicker.js
@@ -160,7 +160,7 @@ export default class TimePicker extends Component {
           [`${prefix}--text-input--invalid`]: invalid,
         }
       ),
-      onChange: evt => {
+      onChange: (evt) => {
         if (!other.disabled) {
           this.setState({
             value: evt.target.value,
@@ -168,7 +168,7 @@ export default class TimePicker extends Component {
           onChange(evt);
         }
       },
-      onClick: evt => {
+      onClick: (evt) => {
         if (!other.disabled) {
           this.setState({
             value: evt.target.value,
@@ -176,7 +176,7 @@ export default class TimePicker extends Component {
           onClick(evt);
         }
       },
-      onBlur: evt => {
+      onBlur: (evt) => {
         if (!other.disabled) {
           this.setState({
             value: evt.target.value,
diff --git a/packages/react/src/components/Toggle/Toggle-test.js b/packages/react/src/components/Toggle/Toggle-test.js
index 6528b4cf87e9..21ddc159e74b 100644
--- a/packages/react/src/components/Toggle/Toggle-test.js
+++ b/packages/react/src/components/Toggle/Toggle-test.js
@@ -86,7 +86,7 @@ describe('Toggle', () => {
       wrapper.find('input').simulate('change');
 
       expect(
-        onChange.mock.calls.map(call =>
+        onChange.mock.calls.map((call) =>
           call.map((arg, i) => (i > 0 ? arg : arg.target))
         )
       ).toEqual([[inputElement]]);
diff --git a/packages/react/src/components/Toggle/Toggle.js b/packages/react/src/components/Toggle/Toggle.js
index 80bc1b4a8a63..f5e12f8bbd7a 100644
--- a/packages/react/src/components/Toggle/Toggle.js
+++ b/packages/react/src/components/Toggle/Toggle.js
@@ -107,14 +107,14 @@ class Toggle extends React.Component {
           type="checkbox"
           id={id}
           className={`${prefix}--toggle-input`}
-          onChange={evt => {
+          onChange={(evt) => {
             onChange && onChange(evt);
             onToggle(input.checked, id, evt);
           }}
-          ref={el => {
+          ref={(el) => {
             input = el;
           }}
-          onKeyUp={evt => {
+          onKeyUp={(evt) => {
             if (match(evt, keys.Enter)) {
               input.checked = !input.checked;
               onChange && onChange(evt);
diff --git a/packages/react/src/components/ToggleSmall/ToggleSmall-test.js b/packages/react/src/components/ToggleSmall/ToggleSmall-test.js
index 3fdff7ee06e9..e2b8ee628b18 100644
--- a/packages/react/src/components/ToggleSmall/ToggleSmall-test.js
+++ b/packages/react/src/components/ToggleSmall/ToggleSmall-test.js
@@ -83,7 +83,7 @@ describe('ToggleSmall', () => {
       wrapper.find('input').simulate('change');
 
       expect(
-        onChange.mock.calls.map(call =>
+        onChange.mock.calls.map((call) =>
           call.map((arg, i) => (i > 0 ? arg : arg.target))
         )
       ).toEqual([[inputElement]]);
diff --git a/packages/react/src/components/ToggleSmall/ToggleSmall.js b/packages/react/src/components/ToggleSmall/ToggleSmall.js
index 565087418159..781f211050e9 100644
--- a/packages/react/src/components/ToggleSmall/ToggleSmall.js
+++ b/packages/react/src/components/ToggleSmall/ToggleSmall.js
@@ -48,14 +48,14 @@ const ToggleSmall = ({
         type="checkbox"
         id={id}
         className={`${prefix}--toggle-input ${prefix}--toggle-input--small`}
-        onChange={evt => {
+        onChange={(evt) => {
           onChange && onChange(evt);
           onToggle(input.checked, id, evt);
         }}
-        ref={el => {
+        ref={(el) => {
           input = el;
         }}
-        onKeyUp={evt => {
+        onKeyUp={(evt) => {
           if (match(evt, keys.Enter)) {
             input.checked = !input.checked;
             onChange && onChange(evt);
diff --git a/packages/react/src/components/ToolbarSearch/ToolbarSearch.js b/packages/react/src/components/ToolbarSearch/ToolbarSearch.js
index 7429d6f5f2ed..6a09fb07b35a 100644
--- a/packages/react/src/components/ToolbarSearch/ToolbarSearch.js
+++ b/packages/react/src/components/ToolbarSearch/ToolbarSearch.js
@@ -123,7 +123,7 @@ export default class ToolbarSearch extends Component {
             id={id}
             aria-labelledby={labelId}
             placeholder={placeHolderText}
-            ref={input => {
+            ref={(input) => {
               this.input = input;
             }}
           />
diff --git a/packages/react/src/components/Tooltip/Tooltip-test.js b/packages/react/src/components/Tooltip/Tooltip-test.js
index e1ae8015dd85..dc7b093d3c19 100644
--- a/packages/react/src/components/Tooltip/Tooltip-test.js
+++ b/packages/react/src/components/Tooltip/Tooltip-test.js
@@ -21,7 +21,7 @@ const { prefix } = settings;
 
 jest.mock('lodash.debounce');
 
-debounce.mockImplementation(fn => fn);
+debounce.mockImplementation((fn) => fn);
 
 describe('Tooltip', () => {
   // An icon component class
@@ -159,15 +159,9 @@ describe('Tooltip', () => {
       // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
       expect(rootWrapper.find('Tooltip').instance().state.open).toBeFalsy();
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('Tooltip')
-        .instance()
-        .setState({ open: true });
+      rootWrapper.find('Tooltip').instance().setState({ open: true });
       rootWrapper.update();
-      rootWrapper
-        .find('Tooltip')
-        .instance()
-        .handleClickOutside();
+      rootWrapper.find('Tooltip').instance().handleClickOutside();
       // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
       expect(rootWrapper.find('Tooltip').instance().state.open).toEqual(false);
     });
@@ -188,10 +182,7 @@ describe('Tooltip', () => {
       const rootWrapper = mount(<Tooltip />);
       rootWrapper.setProps({ open: true });
       // Enzyme doesn't seem to allow setState() in a forwardRef-wrapped class component
-      rootWrapper
-        .find('Tooltip')
-        .instance()
-        .setState({ open: false });
+      rootWrapper.find('Tooltip').instance().setState({ open: false });
       rootWrapper.update();
       rootWrapper.setProps({ open: true });
       // Enzyme doesn't seem to allow state() in a forwardRef-wrapped class component
diff --git a/packages/react/src/components/Tooltip/Tooltip.js b/packages/react/src/components/Tooltip/Tooltip.js
index 272185364421..df8a424f12dc 100644
--- a/packages/react/src/components/Tooltip/Tooltip.js
+++ b/packages/react/src/components/Tooltip/Tooltip.js
@@ -60,7 +60,7 @@ const getMenuOffset = (menuBody, menuDirection) => {
     {}
   );
   values[arrowPositionProp] = values[arrowPositionProp] || -6; // IE, etc.
-  if (Object.keys(values).every(name => !isNaN(values[name]))) {
+  if (Object.keys(values).every((name) => !isNaN(values[name]))) {
     const {
       [arrowPositionProp]: arrowPosition,
       'border-bottom-width': borderBottomWidth,
@@ -153,7 +153,7 @@ class Tooltip extends Component {
      * The callback function to optionally render the icon element.
      * It should be a component with React.forwardRef().
      */
-    renderIcon: function(props, propName, componentName) {
+    renderIcon: function (props, propName, componentName) {
       if (props[propName] == undefined) {
         return;
       }
@@ -304,7 +304,7 @@ class Tooltip extends Component {
     );
   };
 
-  handleMouse = evt => {
+  handleMouse = (evt) => {
     evt.persist();
     const state = {
       focus: 'over',
@@ -329,7 +329,7 @@ class Tooltip extends Component {
     }
   };
 
-  handleClickOutside = evt => {
+  handleClickOutside = (evt) => {
     const shouldPreventClose =
       evt &&
       evt.target &&
@@ -340,7 +340,7 @@ class Tooltip extends Component {
     }
   };
 
-  handleKeyPress = event => {
+  handleKeyPress = (event) => {
     if (keyDownMatch(event, [keys.Escape])) {
       event.stopPropagation();
       this._handleUserInputOpenClose(event, { open: false });
@@ -356,7 +356,7 @@ class Tooltip extends Component {
     }
   };
 
-  handleEscKeyPress = event => {
+  handleEscKeyPress = (event) => {
     const { open } = this.isControlled ? this.props : this.state;
     if (open && keyDownMatch(event, [keys.Escape])) {
       return this._handleUserInputOpenClose(event, { open: false });
@@ -367,14 +367,10 @@ class Tooltip extends Component {
     const {
       triggerId = (this.triggerId =
         this.triggerId ||
-        `__carbon-tooltip-trigger_${Math.random()
-          .toString(36)
-          .substr(2)}`),
+        `__carbon-tooltip-trigger_${Math.random().toString(36).substr(2)}`),
       tooltipId = (this.tooltipId =
         this.tooltipId ||
-        `__carbon-tooltip_${Math.random()
-          .toString(36)
-          .substr(2)}`),
+        `__carbon-tooltip_${Math.random().toString(36).substr(2)}`),
       tooltipBodyId,
       children,
       className,
@@ -460,7 +456,7 @@ class Tooltip extends Component {
             triggerRef={this._triggerRef}
             menuDirection={direction}
             menuOffset={menuOffset}
-            menuRef={node => {
+            menuRef={(node) => {
               this._tooltipEl = node;
             }}>
             <div
diff --git a/packages/react/src/components/TooltipDefinition/TooltipDefinition.js b/packages/react/src/components/TooltipDefinition/TooltipDefinition.js
index 7d8655be810b..079b47804dc9 100644
--- a/packages/react/src/components/TooltipDefinition/TooltipDefinition.js
+++ b/packages/react/src/components/TooltipDefinition/TooltipDefinition.js
@@ -58,7 +58,7 @@ const TooltipDefinition = ({
   };
   const handleMouseLeave = debounceTooltipVisible;
   useEffect(() => {
-    const handleEscKeyDown = event => {
+    const handleEscKeyDown = (event) => {
       if (matches(event, [keys.Escape])) {
         setAllowTooltipVisibility(false);
       }
diff --git a/packages/react/src/components/TooltipIcon/TooltipIcon.js b/packages/react/src/components/TooltipIcon/TooltipIcon.js
index 7ee31cfb362d..4942c0fcf4b3 100644
--- a/packages/react/src/components/TooltipIcon/TooltipIcon.js
+++ b/packages/react/src/components/TooltipIcon/TooltipIcon.js
@@ -41,7 +41,7 @@ const TooltipIcon = ({
   const handleFocus = () => setAllowTooltipVisibility(true);
   const handleMouseEnter = () => setAllowTooltipVisibility(true);
   useEffect(() => {
-    const handleEscKeyDown = event => {
+    const handleEscKeyDown = (event) => {
       if (matches(event, [keys.Escape])) {
         setAllowTooltipVisibility(false);
       }
diff --git a/packages/react/src/components/UIShell/HeaderMenu.js b/packages/react/src/components/UIShell/HeaderMenu.js
index 40d98c787a12..8324d3848619 100644
--- a/packages/react/src/components/UIShell/HeaderMenu.js
+++ b/packages/react/src/components/UIShell/HeaderMenu.js
@@ -74,13 +74,13 @@ class HeaderMenu extends React.Component {
   /**
    * Toggle the expanded state of the menu on click.
    */
-  handleOnClick = e => {
+  handleOnClick = (e) => {
     const { current: subMenusNode } = this._subMenus;
     if (!subMenusNode || !subMenusNode.contains(e.target)) {
       e.preventDefault();
     }
 
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       expanded: !prevState.expanded,
     }));
   };
@@ -88,13 +88,13 @@ class HeaderMenu extends React.Component {
   /**
    * Keyboard event handler for the entire menu.
    */
-  handleOnKeyDown = event => {
+  handleOnKeyDown = (event) => {
     // Handle enter or space key for toggling the expanded state of the menu.
     if (matches(event, [keys.Enter, keys.Space])) {
       event.stopPropagation();
       event.preventDefault();
 
-      this.setState(prevState => ({
+      this.setState((prevState) => ({
         expanded: !prevState.expanded,
       }));
 
@@ -107,11 +107,11 @@ class HeaderMenu extends React.Component {
    * for toggling the expansion status of our menu in response to a user
    * clicking off of the menu or menubar.
    */
-  handleOnBlur = event => {
+  handleOnBlur = (event) => {
     // Rough guess for a blur event that is triggered outside of our menu or
     // menubar context
     const itemTriggeredBlur = this.items.find(
-      element => element === event.relatedTarget
+      (element) => element === event.relatedTarget
     );
     if (
       event.relatedTarget &&
@@ -133,7 +133,7 @@ class HeaderMenu extends React.Component {
    * menu or menubar as it will allow the parent to explicitly focus the menu
    * button node when that child should receive focus.
    */
-  handleMenuButtonRef = node => {
+  handleMenuButtonRef = (node) => {
     if (this.props.focusRef) {
       this.props.focusRef(node);
     }
@@ -144,11 +144,11 @@ class HeaderMenu extends React.Component {
    * Handles individual menuitem refs. We assign them to a class instance
    * property so that we can properly manage focus of our children.
    */
-  handleItemRef = index => node => {
+  handleItemRef = (index) => (node) => {
     this.items[index] = node;
   };
 
-  handleMenuClose = event => {
+  handleMenuClose = (event) => {
     // Handle ESC keydown for closing the expanded menu.
     if (matches(event, [keys.Escape]) && this.state.expanded) {
       event.stopPropagation();
diff --git a/packages/react/src/components/UIShell/HeaderNavigation.js b/packages/react/src/components/UIShell/HeaderNavigation.js
index 84e9293b8fd6..f3696efaa84e 100644
--- a/packages/react/src/components/UIShell/HeaderNavigation.js
+++ b/packages/react/src/components/UIShell/HeaderNavigation.js
@@ -44,7 +44,7 @@ export default class HeaderNavigation extends React.Component {
    * Handles individual menuitem refs. We assign them to a class instance
    * property so that we can properly manage focus of our children.
    */
-  handleItemRef = index => node => {
+  handleItemRef = (index) => (node) => {
     this.items[index] = node;
   };
 
diff --git a/packages/react/src/components/UIShell/SideNav.js b/packages/react/src/components/UIShell/SideNav.js
index ed43a1868248..eab7688894f7 100644
--- a/packages/react/src/components/UIShell/SideNav.js
+++ b/packages/react/src/components/UIShell/SideNav.js
@@ -81,7 +81,7 @@ const SideNav = React.forwardRef(function SideNav(props, ref) {
 
   // if a rail, pass the expansion state as a prop, so children can update themselves to match
   if (isRail) {
-    childrenToRender = React.Children.map(children, child => {
+    childrenToRender = React.Children.map(children, (child) => {
       // if we are controlled, check for if we have hovered over or the expanded state, else just use the expanded state (uncontrolled)
       let currentExpansionState = controlled
         ? expandedViaHoverState || expanded
@@ -95,12 +95,12 @@ const SideNav = React.forwardRef(function SideNav(props, ref) {
   let eventHandlers = {};
 
   if (addFocusListeners) {
-    eventHandlers.onFocus = event => {
+    eventHandlers.onFocus = (event) => {
       if (!event.currentTarget.contains(event.relatedTarget)) {
         handleToggle(event, true);
       }
     };
-    eventHandlers.onBlur = event => {
+    eventHandlers.onBlur = (event) => {
       if (!event.currentTarget.contains(event.relatedTarget)) {
         handleToggle(event, false);
       }
@@ -127,7 +127,7 @@ const SideNav = React.forwardRef(function SideNav(props, ref) {
 });
 
 SideNav.defaultProps = {
-  translateById: id => {
+  translateById: (id) => {
     const translations = {
       'carbon.sidenav.state.open': 'Close',
       'carbon.sidenav.state.closed': 'Open',
diff --git a/packages/react/src/components/UIShell/SideNavFooter.js b/packages/react/src/components/UIShell/SideNavFooter.js
index 1510dff3e898..45fa840cdddc 100644
--- a/packages/react/src/components/UIShell/SideNavFooter.js
+++ b/packages/react/src/components/UIShell/SideNavFooter.js
@@ -31,7 +31,7 @@ const SideNavFooter = ({
       <button
         className={`${prefix}--side-nav__toggle`}
         type="button"
-        onClick={evt => onToggle(evt)}
+        onClick={(evt) => onToggle(evt)}
         title={assistiveText}>
         <div className={`${prefix}--side-nav__icon`}>
           {expanded ? <Close20 /> : <ChevronRight20 />}
diff --git a/packages/react/src/components/UIShell/SideNavItems.js b/packages/react/src/components/UIShell/SideNavItems.js
index 618feb2cd1e7..a55f34323f9e 100644
--- a/packages/react/src/components/UIShell/SideNavItems.js
+++ b/packages/react/src/components/UIShell/SideNavItems.js
@@ -18,7 +18,7 @@ const SideNavItems = ({
   isSideNavExpanded,
 }) => {
   const className = cx([`${prefix}--side-nav__items`], customClassName);
-  const childrenWithExpandedState = React.Children.map(children, child => {
+  const childrenWithExpandedState = React.Children.map(children, (child) => {
     if (React.isValidElement(child)) {
       return React.cloneElement(child, { isSideNavExpanded });
     }
diff --git a/packages/react/src/components/UIShell/SideNavLink.js b/packages/react/src/components/UIShell/SideNavLink.js
index 194d710662b9..258585cf0801 100644
--- a/packages/react/src/components/UIShell/SideNavLink.js
+++ b/packages/react/src/components/UIShell/SideNavLink.js
@@ -81,7 +81,7 @@ SideNavLink.defaultProps = {
   large: false,
 };
 
-export const createCustomSideNavLink = element => props => {
+export const createCustomSideNavLink = (element) => (props) => {
   return <SideNavLink element={element} {...props} />;
 };
 
diff --git a/packages/react/src/components/UIShell/SideNavMenu.js b/packages/react/src/components/UIShell/SideNavMenu.js
index 55def7bf12c4..dd3d1c613261 100644
--- a/packages/react/src/components/UIShell/SideNavMenu.js
+++ b/packages/react/src/components/UIShell/SideNavMenu.js
@@ -98,10 +98,10 @@ export class SideNavMenu extends React.Component {
   }
 
   handleToggleExpand = () => {
-    this.setState(state => ({ isExpanded: !state.isExpanded }));
+    this.setState((state) => ({ isExpanded: !state.isExpanded }));
   };
 
-  handleKeyDown = event => {
+  handleKeyDown = (event) => {
     if (match(event, keys.Escape)) {
       this.setState(() => ({ isExpanded: false }));
     }
@@ -123,7 +123,7 @@ export class SideNavMenu extends React.Component {
     if (children) {
       // if we have children, either a single or multiple, find if it is active
       hasActiveChild = Array.isArray(children)
-        ? children.some(child => {
+        ? children.some((child) => {
             if (
               child.props &&
               (child.props.isActive === true || child.props['aria-current'])
diff --git a/packages/react/src/components/UIShell/SideNavSwitcher.js b/packages/react/src/components/UIShell/SideNavSwitcher.js
index 95a53e9707c6..5ce50b49e883 100644
--- a/packages/react/src/components/UIShell/SideNavSwitcher.js
+++ b/packages/react/src/components/UIShell/SideNavSwitcher.js
@@ -38,7 +38,7 @@ const SideNavSwitcher = React.forwardRef(function SideNavSwitcher(props, ref) {
           value="">
           {labelText}
         </option>
-        {options.map(option => (
+        {options.map((option) => (
           <option
             key={option}
             className={`${prefix}--side-nav__option`}
diff --git a/packages/react/src/components/UIShell/__tests__/Link-test.js b/packages/react/src/components/UIShell/__tests__/Link-test.js
index 283a3d6f7552..5ed9333c340f 100644
--- a/packages/react/src/components/UIShell/__tests__/Link-test.js
+++ b/packages/react/src/components/UIShell/__tests__/Link-test.js
@@ -31,7 +31,7 @@ describe('UI Shell - Link', () => {
   });
 
   it('should support rendering a component as the element', () => {
-    const mockComponent = props => <a {...props}>link</a>;
+    const mockComponent = (props) => <a {...props}>link</a>;
     const wrapper = mount(<Link {...mockProps} element={mockComponent} />);
     expect(wrapper).toMatchSnapshot();
   });
diff --git a/packages/react/src/components/UIShell/__tests__/SideNavMenu-test.js b/packages/react/src/components/UIShell/__tests__/SideNavMenu-test.js
index d61ec0737297..e5bef161517f 100644
--- a/packages/react/src/components/UIShell/__tests__/SideNavMenu-test.js
+++ b/packages/react/src/components/UIShell/__tests__/SideNavMenu-test.js
@@ -86,10 +86,7 @@ describe('SideNavMenu', () => {
       children: <SideNavMenuItem isActive={true}>Test</SideNavMenuItem>,
     });
     expect(
-      wrapper
-        .find('li')
-        .at(0)
-        .hasClass(`${prefix}--side-nav__item--active`)
+      wrapper.find('li').at(0).hasClass(`${prefix}--side-nav__item--active`)
     ).toBe(true);
     wrapper.setProps({
       children: [
@@ -100,10 +97,7 @@ describe('SideNavMenu', () => {
       ],
     });
     expect(
-      wrapper
-        .find('li')
-        .at(0)
-        .hasClass(`${prefix}--side-nav__item--active`)
+      wrapper.find('li').at(0).hasClass(`${prefix}--side-nav__item--active`)
     ).toBe(true);
   });
 
diff --git a/packages/react/src/internal/FloatingMenu.js b/packages/react/src/internal/FloatingMenu.js
index d98760d98f28..5023bc4125d0 100644
--- a/packages/react/src/internal/FloatingMenu.js
+++ b/packages/react/src/internal/FloatingMenu.js
@@ -305,7 +305,7 @@ class FloatingMenu extends React.Component {
    * @param {Element} menuBody The DOM element of the menu body.
    * @private
    */
-  _focusMenuContent = menuBody => {
+  _focusMenuContent = (menuBody) => {
     const primaryFocusNode = menuBody.querySelector(
       this.props.selectorPrimaryFocus || null
     );
@@ -344,7 +344,7 @@ class FloatingMenu extends React.Component {
    * A callback for called when menu body is mounted or unmounted.
    * @param {Element} menuBody The menu body being mounted. `null` if the menu body is being unmounted.
    */
-  _menuRef = menuBody => {
+  _menuRef = (menuBody) => {
     const { menuRef } = this.props;
     this._placeInProgress = !!menuBody;
     menuRef && menuRef((this._menuBody = menuBody));
diff --git a/packages/react/src/internal/OptimizedResize.js b/packages/react/src/internal/OptimizedResize.js
index bdc44c0acf8f..a57180eaedee 100644
--- a/packages/react/src/internal/OptimizedResize.js
+++ b/packages/react/src/internal/OptimizedResize.js
@@ -14,7 +14,7 @@ const OptimizedResize = (function optimizedResize() {
 
   // run the actual callbacks
   function runCallbacks() {
-    callbacks.forEach(callback => {
+    callbacks.forEach((callback) => {
       callback();
     });
 
@@ -41,7 +41,7 @@ const OptimizedResize = (function optimizedResize() {
 
   return {
     // public method to add additional callback
-    add: callback => {
+    add: (callback) => {
       if (!callbacks.length) {
         window.addEventListener('resize', resize);
       }
diff --git a/packages/react/src/internal/Selection.js b/packages/react/src/internal/Selection.js
index 664e7e3a6dc4..280c08b5f07d 100644
--- a/packages/react/src/internal/Selection.js
+++ b/packages/react/src/internal/Selection.js
@@ -17,7 +17,7 @@ export function useSelection({
   const isMounted = useRef(false);
   const [selectedItems, setSelectedItems] = useState(initialSelectedItems);
   const onItemChange = useCallback(
-    item => {
+    (item) => {
       if (disabled) {
         return;
       }
@@ -30,11 +30,11 @@ export function useSelection({
       });
 
       if (selectedIndex === undefined) {
-        setSelectedItems(selectedItems => selectedItems.concat(item));
+        setSelectedItems((selectedItems) => selectedItems.concat(item));
         return;
       }
 
-      setSelectedItems(selectedItems =>
+      setSelectedItems((selectedItems) =>
         removeAtIndex(selectedItems, selectedIndex)
       );
     },
@@ -103,19 +103,19 @@ export default class Selection extends React.Component {
     });
   };
 
-  handleSelectItem = item => {
-    this.internalSetState(state => ({
+  handleSelectItem = (item) => {
+    this.internalSetState((state) => ({
       selectedItems: state.selectedItems.concat(item),
     }));
   };
 
-  handleRemoveItem = index => {
-    this.internalSetState(state => ({
+  handleRemoveItem = (index) => {
+    this.internalSetState((state) => ({
       selectedItems: removeAtIndex(state.selectedItems, index),
     }));
   };
 
-  handleOnItemChange = item => {
+  handleOnItemChange = (item) => {
     if (this.props.disabled) {
       return;
     }
diff --git a/packages/react/src/internal/__tests__/InnerClickListener-test.js b/packages/react/src/internal/__tests__/InnerClickListener-test.js
index fb066d92c580..28aa5692eb79 100644
--- a/packages/react/src/internal/__tests__/InnerClickListener-test.js
+++ b/packages/react/src/internal/__tests__/InnerClickListener-test.js
@@ -100,7 +100,7 @@ describe('InnerClickListener', () => {
       }
     );
 
-    document.getElementById('1').addEventListener('click', function() {
+    document.getElementById('1').addEventListener('click', function () {
       this.parentNode.removeChild(this);
     });
     document.getElementById('1').click();
diff --git a/packages/react/src/internal/keyboard/__tests__/match-test.js b/packages/react/src/internal/keyboard/__tests__/match-test.js
index ef8d231786df..0fc5d98a9439 100644
--- a/packages/react/src/internal/keyboard/__tests__/match-test.js
+++ b/packages/react/src/internal/keyboard/__tests__/match-test.js
@@ -29,7 +29,7 @@ describe('match', () => {
     inputNode.parentNode.removeChild(inputNode);
   });
 
-  it.each(Object.keys(keys))('should match when using %s', key => {
+  it.each(Object.keys(keys))('should match when using %s', (key) => {
     // Clone the export so we don't accidentally mutate it in the if block below
     const keyboardEventInit = Object.assign({}, keys[key]);
 
diff --git a/packages/react/src/internal/wrapFocus.js b/packages/react/src/internal/wrapFocus.js
index 27463d0b36ad..b4c96c5c0ecf 100644
--- a/packages/react/src/internal/wrapFocus.js
+++ b/packages/react/src/internal/wrapFocus.js
@@ -29,7 +29,7 @@ function elementOrParentIsFloatingMenu(
   ]
 ) {
   if (node && typeof node.closest === 'function') {
-    return selectorsFloatingMenus.some(selector => node.closest(selector));
+    return selectorsFloatingMenus.some((selector) => node.closest(selector));
   }
 }
 
@@ -67,7 +67,7 @@ function wrapFocus({
     ) {
       const tabbable = findLast(
         modalNode.querySelectorAll(selectorTabbable),
-        elem => Boolean(elem.offsetParent)
+        (elem) => Boolean(elem.offsetParent)
       );
       if (tabbable) {
         tabbable.focus();
@@ -80,7 +80,7 @@ function wrapFocus({
     ) {
       const tabbable = Array.prototype.find.call(
         modalNode.querySelectorAll(selectorTabbable),
-        elem => Boolean(elem.offsetParent)
+        (elem) => Boolean(elem.offsetParent)
       );
       if (tabbable) {
         tabbable.focus();
diff --git a/packages/react/src/prop-types/childrenOfType.js b/packages/react/src/prop-types/childrenOfType.js
index 616ab3de1466..9db4e49754b1 100644
--- a/packages/react/src/prop-types/childrenOfType.js
+++ b/packages/react/src/prop-types/childrenOfType.js
@@ -16,13 +16,13 @@ import getDisplayName from './tools/getDisplayName';
  *
  * This prop validator also supports chaining through `isRequired`
  */
-const childrenOfType = expectedChildType => {
+const childrenOfType = (expectedChildType) => {
   const expectedDisplayName = getDisplayName(
     // Support both React elements and components by using `type` if it exists
     expectedChildType.type || expectedChildType
   );
   const validate = (props, propName, componentName) => {
-    Children.forEach(props[propName], child => {
+    Children.forEach(props[propName], (child) => {
       if (!child) {
         return;
       }
diff --git a/packages/react/src/prop-types/isRequiredOneOf.js b/packages/react/src/prop-types/isRequiredOneOf.js
index 7a04cd837fff..6644bf6cf708 100644
--- a/packages/react/src/prop-types/isRequiredOneOf.js
+++ b/packages/react/src/prop-types/isRequiredOneOf.js
@@ -13,8 +13,8 @@
  */
 export default function isRequiredOneOf(propTypes) {
   const names = Object.keys(propTypes);
-  const checker = propType => (props, propName, componentName, ...rest) => {
-    if (__DEV__ && names.every(name => typeof props[name] === 'undefined')) {
+  const checker = (propType) => (props, propName, componentName, ...rest) => {
+    if (__DEV__ && names.every((name) => typeof props[name] === 'undefined')) {
       return new Error(
         `${componentName} requires one of the following props: ${names.join(
           ', '
diff --git a/packages/react/src/prop-types/tools/createChainableTypeChecker.js b/packages/react/src/prop-types/tools/createChainableTypeChecker.js
index 0b857bc38870..82440288dc3a 100644
--- a/packages/react/src/prop-types/tools/createChainableTypeChecker.js
+++ b/packages/react/src/prop-types/tools/createChainableTypeChecker.js
@@ -9,7 +9,7 @@
  * `createChainableTypeChecker` is used inside of our custom prop validators to
  * add in chaining `isRequired` on a given prop validator.
  */
-const createChainableTypeChecker = validate => {
+const createChainableTypeChecker = (validate) => {
   // `checkType` is borrowed heavily from the `prop-types` package
   const checkType = (isRequired, props, propName, componentName, location) => {
     if (props[propName] == null) {
diff --git a/packages/react/src/prop-types/tools/getDisplayName.js b/packages/react/src/prop-types/tools/getDisplayName.js
index 2d1b088dca14..38d7989ce2cc 100644
--- a/packages/react/src/prop-types/tools/getDisplayName.js
+++ b/packages/react/src/prop-types/tools/getDisplayName.js
@@ -12,7 +12,7 @@ const cachedDisplayNames = new WeakMap();
  * component type. It supports names from React elements, Stateless Functional
  * Components, and Class-based Components
  */
-const getDisplayName = type => {
+const getDisplayName = (type) => {
   if (typeof type === 'string') {
     return type;
   }
diff --git a/packages/react/src/tools/__tests__/events-test.js b/packages/react/src/tools/__tests__/events-test.js
index e581a90233c7..3fa24edf5cc9 100644
--- a/packages/react/src/tools/__tests__/events-test.js
+++ b/packages/react/src/tools/__tests__/events-test.js
@@ -21,14 +21,14 @@ describe('events tools', () => {
 
     it('should call all handlers if the event has not been prevented', () => {
       composeEventHandlers(mockHandlers)(mockEvent);
-      mockHandlers.forEach(handler => {
+      mockHandlers.forEach((handler) => {
         expect(handler).toHaveBeenCalledTimes(1);
         expect(handler).toHaveBeenCalledWith(mockEvent);
       });
     });
 
     it('should stop if a handler calls `preventDefault`', () => {
-      const preventDefaultHandler = jest.fn(event => {
+      const preventDefaultHandler = jest.fn((event) => {
         event.preventDefault();
       });
       const handlers = [preventDefaultHandler, ...mockHandlers];
@@ -36,7 +36,7 @@ describe('events tools', () => {
 
       expect(preventDefaultHandler).toHaveBeenCalledTimes(1);
       expect(preventDefaultHandler).toHaveBeenCalledWith(mockEvent);
-      handlers.slice(1).forEach(handler => {
+      handlers.slice(1).forEach((handler) => {
         expect(handler).not.toHaveBeenCalled();
       });
     });
diff --git a/packages/react/src/tools/__tests__/mergeRefs-test.js b/packages/react/src/tools/__tests__/mergeRefs-test.js
index 61dae1ec2854..5c3ea0d85745 100644
--- a/packages/react/src/tools/__tests__/mergeRefs-test.js
+++ b/packages/react/src/tools/__tests__/mergeRefs-test.js
@@ -13,7 +13,7 @@ describe('mergeRefs', () => {
     const elem = document.createElement('div');
     const ref = React.createRef();
     let functionRefResult;
-    mergeRefs(ref, el => {
+    mergeRefs(ref, (el) => {
       functionRefResult = el;
     })(elem);
     expect(ref.current).toBe(elem);
diff --git a/packages/react/src/tools/createPropAdapter.js b/packages/react/src/tools/createPropAdapter.js
index 08da0a988e11..be31fda19d43 100644
--- a/packages/react/src/tools/createPropAdapter.js
+++ b/packages/react/src/tools/createPropAdapter.js
@@ -18,7 +18,7 @@ function createPropAdapter(spec) {
   // if props aren't passed in we should default the prop to empty object
   return (input = {}) => {
     const output = {};
-    Object.keys(input).forEach(key => {
+    Object.keys(input).forEach((key) => {
       const match = spec.find(([regex]) => {
         return key.match(regex);
       });
diff --git a/packages/react/src/tools/events.js b/packages/react/src/tools/events.js
index 737c743f50b9..3b0631375820 100644
--- a/packages/react/src/tools/events.js
+++ b/packages/react/src/tools/events.js
@@ -14,7 +14,7 @@
  * @param {Array<Function>} fns array of functions to apply to the event
  * @returns {Function}
  */
-export const composeEventHandlers = fns => (event, ...args) => {
+export const composeEventHandlers = (fns) => (event, ...args) => {
   for (let i = 0; i < fns.length; i++) {
     if (event.defaultPrevented) {
       break;
diff --git a/packages/react/src/tools/mergeRefs.js b/packages/react/src/tools/mergeRefs.js
index 16990a6ada52..19f9879ba85f 100644
--- a/packages/react/src/tools/mergeRefs.js
+++ b/packages/react/src/tools/mergeRefs.js
@@ -9,8 +9,8 @@
  * @param {...Ref<Element>} refs List of React refs to merge.
  * @returns {Ref<Element>} Merged React ref.
  */
-const mergeRefs = (...refs) => el => {
-  refs.forEach(ref => {
+const mergeRefs = (...refs) => (el) => {
+  refs.forEach((ref) => {
     // https://github.com/facebook/react/issues/13029#issuecomment-410002316
     if (typeof ref === 'function') {
       ref(el);
diff --git a/packages/react/src/tools/uniqueId.js b/packages/react/src/tools/uniqueId.js
index dbe91237c66c..2285260205a2 100644
--- a/packages/react/src/tools/uniqueId.js
+++ b/packages/react/src/tools/uniqueId.js
@@ -7,7 +7,7 @@
 
 let lastId = 0;
 
-export default function(prefix = 'id') {
+export default function (prefix = 'id') {
   lastId++;
   return `${prefix}${lastId}`;
 }
diff --git a/packages/scss-generator/package.json b/packages/scss-generator/package.json
index 160eb5d88486..f8fcff3cbb32 100644
--- a/packages/scss-generator/package.json
+++ b/packages/scss-generator/package.json
@@ -19,6 +19,6 @@
     "access": "public"
   },
   "dependencies": {
-    "prettier": "^1.19.1"
+    "prettier": "^2.0.5"
   }
 }
diff --git a/packages/scss-generator/src/types/assert.js b/packages/scss-generator/src/types/assert.js
index 1e220ad933c1..099ae860c279 100644
--- a/packages/scss-generator/src/types/assert.js
+++ b/packages/scss-generator/src/types/assert.js
@@ -20,7 +20,7 @@ function assertDefined(node) {
 }
 
 function assertValueType(expected) {
-  return value => {
+  return (value) => {
     if (typeof value !== expected) {
       throw new TypeError(
         `Expected value to be of type ${expected}, instead ` +
@@ -31,7 +31,7 @@ function assertValueType(expected) {
 }
 
 function assertType({ type }) {
-  return node => {
+  return (node) => {
     assertDefined(node);
 
     if (node.type !== type) {
@@ -62,7 +62,7 @@ function assertOneOf(types) {
 
     throw new TypeError(
       `Expected node to match one of the expected types for ${node.type}.\n\n` +
-        errors.map(error => error.message).join('\n') +
+        errors.map((error) => error.message).join('\n') +
         '\n'
     );
   };
diff --git a/packages/scss-generator/src/types/definitions.js b/packages/scss-generator/src/types/definitions.js
index beac6255a0dd..5f94d16879b9 100644
--- a/packages/scss-generator/src/types/definitions.js
+++ b/packages/scss-generator/src/types/definitions.js
@@ -570,7 +570,7 @@ const Assignment = defineType('Assignment', {
       // after an assignment
       if (collection && collection.length > 1) {
         const assignments = collection.filter(
-          node => node.type === Assignment.type
+          (node) => node.type === Assignment.type
         );
         if (
           assignments.length === 1 ||
diff --git a/packages/sketch/src/commands/colors/generate.js b/packages/sketch/src/commands/colors/generate.js
index a05a84757b3b..d302ccec12d7 100644
--- a/packages/sketch/src/commands/colors/generate.js
+++ b/packages/sketch/src/commands/colors/generate.js
@@ -22,7 +22,7 @@ export function generate() {
     const sharedStyles = syncColorStyles(document, 'fill');
     const { black, white, colors, support } = groupByKey(
       sharedStyles,
-      sharedStyle => {
+      (sharedStyle) => {
         const { name } = sharedStyle;
         const [_category, _type, swatch] = name.split(' / ');
         switch (swatch) {
@@ -42,7 +42,7 @@ export function generate() {
     let X_OFFSET = 0;
     let Y_OFFSET = 0;
 
-    const swatches = groupByKey(colors, sharedStyle => {
+    const swatches = groupByKey(colors, (sharedStyle) => {
       const [_category, _type, swatch] = sharedStyle.name.split('/');
       return swatch;
     });
diff --git a/packages/sketch/src/commands/icons/generate.js b/packages/sketch/src/commands/icons/generate.js
index f1977f6f1b8a..1d1360c20a3d 100644
--- a/packages/sketch/src/commands/icons/generate.js
+++ b/packages/sketch/src/commands/icons/generate.js
@@ -64,14 +64,14 @@ export function generate() {
         let ICON_Y_OFFSET = subcategoryText.frame.height + 8;
         let COLUMN_COUNT = 0;
 
-        const members = subcategory.members.filter(member => {
-          const icon = icons.find(icon => icon.name === member);
+        const members = subcategory.members.filter((member) => {
+          const icon = icons.find((icon) => icon.name === member);
           return !icon.deprecated;
         });
 
         for (const icon of members) {
-          const symbol = symbols.find(symbol => {
-            const parts = symbol.name.split('/').map(string => string.trim());
+          const symbol = symbols.find((symbol) => {
+            const parts = symbol.name.split('/').map((string) => string.trim());
             const [_type, _category, _subcategory, name, size] = parts;
             return name === icon && size === '32';
           });
diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js
index 5d5c7140f74c..c84724ebe985 100644
--- a/packages/sketch/src/commands/icons/shared.js
+++ b/packages/sketch/src/commands/icons/shared.js
@@ -39,7 +39,7 @@ export function syncIconSymbols(
     sizes.sort().reverse()
   );
 
-  return artboards.map(artboard => {
+  return artboards.map((artboard) => {
     return syncSymbol(symbols, sharedLayerStyles, artboard.name, {
       name: artboard.name,
       frame: artboard.frame,
@@ -88,15 +88,15 @@ function createSVGArtboards(
   let Y_OFFSET = getInitialPageOffset(page) + ARTBOARD_MARGIN;
 
   return icons
-    .filter(icon => !icon.deprecated)
-    .flatMap(icon => {
-      const defaultAsset = icon.assets.find(asset => asset.size === 32);
+    .filter((icon) => !icon.deprecated)
+    .flatMap((icon) => {
+      const defaultAsset = icon.assets.find((asset) => asset.size === 32);
 
       X_OFFSET = 0;
 
-      const artboards = sizes.map(size => {
+      const artboards = sizes.map((size) => {
         const asset =
-          icon.assets.find(asset => asset.size === size) || defaultAsset;
+          icon.assets.find((asset) => asset.size === size) || defaultAsset;
         const svgString = NSString.stringWithString(asset.source);
         const svgData = svgString.dataUsingEncoding(NSUTF8StringEncoding);
         const svgImporter = MSSVGImporter.svgImporter();
@@ -129,7 +129,7 @@ function createSVGArtboards(
         });
 
         const [group] = artboard.layers;
-        const paths = group.layers.map(layer => layer.duplicate());
+        const paths = group.layers.map((layer) => layer.duplicate());
 
         /**
          * There are several different types of layers that we might run into.
@@ -145,7 +145,7 @@ function createSVGArtboards(
           innerPaths = [],
           transparent = [],
           cutouts = [],
-        } = groupByKey(paths, layer => {
+        } = groupByKey(paths, (layer) => {
           if (layer.name === 'Rectangle') {
             if (layer.frame.width === size && layer.frame.height === size) {
               return 'transparent';
diff --git a/packages/sketch/src/commands/themes/generate.js b/packages/sketch/src/commands/themes/generate.js
index 1ca3ec48444e..8b9da9f012b1 100644
--- a/packages/sketch/src/commands/themes/generate.js
+++ b/packages/sketch/src/commands/themes/generate.js
@@ -23,7 +23,7 @@ export function generate() {
     const page = selectPage(findOrCreatePage(document, 'themes'));
     const sharedStyles = syncThemeColorStyles(document, 'fill');
 
-    const tokens = groupByKey(sharedStyles, sharedStyle => {
+    const tokens = groupByKey(sharedStyles, (sharedStyle) => {
       const [_namespace, _category, _group, token] = sharedStyle.name.split(
         '/'
       );
diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js
index 54b2926ddbf5..c85af36b3dea 100644
--- a/packages/sketch/src/sharedStyles/colors.js
+++ b/packages/sketch/src/sharedStyles/colors.js
@@ -19,9 +19,9 @@ const { black, white, orange, yellow, ...swatches } = colors;
  * @returns {Array<SharedStyle>}
  */
 export function syncColorStyles(document, type) {
-  const sharedStyles = Object.keys(swatches).flatMap(swatchName => {
+  const sharedStyles = Object.keys(swatches).flatMap((swatchName) => {
     const name = formatTokenName(swatchName);
-    const result = Object.keys(swatches[swatchName]).map(grade => {
+    const result = Object.keys(swatches[swatchName]).map((grade) => {
       return syncColorStyle(
         document,
         formatSharedStyleName(name, type, grade),
diff --git a/packages/sketch/src/sharedStyles/themes.js b/packages/sketch/src/sharedStyles/themes.js
index a329bb713093..33c535ee0d03 100644
--- a/packages/sketch/src/sharedStyles/themes.js
+++ b/packages/sketch/src/sharedStyles/themes.js
@@ -32,13 +32,13 @@ export function syncThemeColorStyles(document, styleType) {
     'Gray 100 theme': g100,
   };
 
-  const sharedStyles = Object.keys(themes).flatMap(theme => {
+  const sharedStyles = Object.keys(themes).flatMap((theme) => {
     return Object.keys(themes[theme])
-      .filter(token => {
+      .filter((token) => {
         return colors.includes(token) && !meta.deprecated.includes(token);
       })
-      .map(token => {
-        const { type } = meta.colors.find(group => {
+      .map((token) => {
+        const { type } = meta.colors.find((group) => {
           return group.tokens.includes(token);
         });
         const name = `theme / ${theme.toLowerCase()} / ${type} tokens / ${formatTokenName(
diff --git a/packages/sketch/src/sharedStyles/type.js b/packages/sketch/src/sharedStyles/type.js
index 31871854fff8..be99d125e9ce 100644
--- a/packages/sketch/src/sharedStyles/type.js
+++ b/packages/sketch/src/sharedStyles/type.js
@@ -31,7 +31,7 @@ const expressiveTokens = new Set(['display', 'quotation', 'expressive']);
  */
 export function syncTextStyles(document) {
   return Object.keys(styles)
-    .filter(token => {
+    .filter((token) => {
       for (const pattern of expressiveTokens) {
         if (token.includes(pattern)) {
           return false;
@@ -39,7 +39,7 @@ export function syncTextStyles(document) {
       }
       return true;
     })
-    .map(token => {
+    .map((token) => {
       const name = formatSharedStyleName(token);
       const style = convertTypeStyle(token, styles[token]);
       const sharedTextStyle = syncSharedStyle(
diff --git a/packages/sketch/src/tools/page.js b/packages/sketch/src/tools/page.js
index 61617276dc6b..51dbde680959 100644
--- a/packages/sketch/src/tools/page.js
+++ b/packages/sketch/src/tools/page.js
@@ -14,7 +14,7 @@ import { Page } from 'sketch/dom';
  * @returns {Page}
  */
 export function findOrCreatePage(document, name) {
-  const [page] = document.pages.filter(page => page.name === name);
+  const [page] = document.pages.filter((page) => page.name === name);
 
   if (page) {
     page.remove();
diff --git a/packages/sketch/src/tools/sharedStyles.js b/packages/sketch/src/tools/sharedStyles.js
index 9c0b48915a84..2226f1834c3d 100644
--- a/packages/sketch/src/tools/sharedStyles.js
+++ b/packages/sketch/src/tools/sharedStyles.js
@@ -27,9 +27,11 @@ export function syncSharedStyle(
     styleType === SharedStyle.StyleType.Layer
       ? document.sharedLayerStyles
       : document.sharedTextStyles;
-  const [sharedStyle] = Array.from(documentSharedStyles).filter(sharedStyle => {
-    return sharedStyle.name === name;
-  });
+  const [sharedStyle] = Array.from(documentSharedStyles).filter(
+    (sharedStyle) => {
+      return sharedStyle.name === name;
+    }
+  );
 
   // If none exists, we can create one from scratch
   if (!sharedStyle) {
@@ -43,7 +45,7 @@ export function syncSharedStyle(
 
   // Otherwise, we'll go and update values of the sharedStyle with the given
   // style if the values are different
-  Object.keys(style).forEach(key => {
+  Object.keys(style).forEach((key) => {
     if (sharedStyle.style[key] !== style[key]) {
       sharedStyle.style[key] = style[key];
     }
diff --git a/packages/sketch/src/tools/symbols.js b/packages/sketch/src/tools/symbols.js
index 907c114beaaf..752d92afb690 100644
--- a/packages/sketch/src/tools/symbols.js
+++ b/packages/sketch/src/tools/symbols.js
@@ -17,7 +17,7 @@ import { SymbolMaster } from 'sketch/dom';
  * @returns {SketchSymbol}
  */
 export function syncSymbol(symbols, sharedLayerStyles, name, config) {
-  const symbol = symbols.find(symbol => symbol.name === name);
+  const symbol = symbols.find((symbol) => symbol.name === name);
 
   if (!symbol) {
     return new SymbolMaster({
@@ -26,7 +26,7 @@ export function syncSymbol(symbols, sharedLayerStyles, name, config) {
     });
   }
 
-  Object.keys(config).forEach(key => {
+  Object.keys(config).forEach((key) => {
     if (key === 'layers') {
       syncSymbolLayers(sharedLayerStyles, symbol, config);
     } else {
@@ -60,10 +60,10 @@ function syncSymbolLayers(sharedLayerStyles, original, proposed) {
   //
   // If nothing is shared between original and proposed, then the layers in
   // proposed will be used.
-  original.layers = proposed.layers.map(proposedLayer => {
+  original.layers = proposed.layers.map((proposedLayer) => {
     // We often name nested layers that can be overridden.
     const { name } = proposedLayer;
-    const originalLayer = original.layers.find(layer => {
+    const originalLayer = original.layers.find((layer) => {
       return layer.name === name;
     });
 
@@ -84,7 +84,7 @@ function syncSymbolLayers(sharedLayerStyles, original, proposed) {
 
       // If our original layer has a shared style, we'll update it to match
       if (originalLayer.sharedStyleId) {
-        const sharedStyle = sharedLayerStyles.find(sharedStyle => {
+        const sharedStyle = sharedLayerStyles.find((sharedStyle) => {
           return originalLayer.sharedStyleId === sharedStyle.id;
         });
 
diff --git a/packages/sketch/tasks/build.js b/packages/sketch/tasks/build.js
index 52342959dc83..0276996df4db 100644
--- a/packages/sketch/tasks/build.js
+++ b/packages/sketch/tasks/build.js
@@ -46,7 +46,7 @@ async function build() {
   });
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.log(error);
   process.exit(1);
 });
diff --git a/packages/test-utils/dom.js b/packages/test-utils/dom.js
index e41a7c6a7e6f..b78fa36a4f2d 100644
--- a/packages/test-utils/dom.js
+++ b/packages/test-utils/dom.js
@@ -47,7 +47,7 @@ export function getByLabel(node, label) {
 
     if (node.hasAttribute('aria-labelledby')) {
       const labelledby = node.getAttribute('aria-labelledby');
-      const labelers = labelledby.split(' ').map(id => {
+      const labelers = labelledby.split(' ').map((id) => {
         return document.getElementById(id);
       });
 
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
index b171239bfc68..828c7d8d2010 100644
--- a/packages/test-utils/package.json
+++ b/packages/test-utils/package.json
@@ -22,7 +22,7 @@
     "react-dom": "^16.9.0"
   },
   "dependencies": {
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.5",
     "resolve": "^1.12.0",
     "tabbable": "^4.0.0"
   },
diff --git a/packages/test-utils/scss.js b/packages/test-utils/scss.js
index 26e1bd8941b6..606a3cadc724 100644
--- a/packages/test-utils/scss.js
+++ b/packages/test-utils/scss.js
@@ -92,7 +92,7 @@ function createImporter(cwd) {
  */
 function createSassRenderer(cwd, initialData = '') {
   const importer = createImporter(cwd);
-  return async data => {
+  return async (data) => {
     const calls = [];
     const warn = jest.fn(() => types.Null());
     const mockError = jest.fn(() => types.Null());
@@ -142,7 +142,7 @@ function createSassRenderer(cwd, initialData = '') {
       output,
       getOutput(level = 'debug') {
         return output[level].mock.calls
-          .map(call => convert(call[0]))
+          .map((call) => convert(call[0]))
           .join('\n');
       },
     };
diff --git a/packages/themes/__tests__/mixins-test.js b/packages/themes/__tests__/mixins-test.js
index e91bbb3c7393..a4d3bd6ff185 100644
--- a/packages/themes/__tests__/mixins-test.js
+++ b/packages/themes/__tests__/mixins-test.js
@@ -28,7 +28,7 @@ describe('_mixins.scss', () => {
   });
 
   it('should set token variables for the given theme', async () => {
-    const themeTests = Object.keys(themes).map(key => {
+    const themeTests = Object.keys(themes).map((key) => {
       const variable = `$carbon--theme--${key}`;
       const test = `
         @include carbon--theme(${variable}) {
@@ -51,7 +51,7 @@ describe('_mixins.scss', () => {
   });
 
   it('should set token variables for the given theme', async () => {
-    const themeTests = Object.keys(themes).map(key => {
+    const themeTests = Object.keys(themes).map((key) => {
       const variable = `$carbon--theme--${key}`;
       const test = `
         $feature-flags: (enable-css-custom-properties: true);
@@ -91,7 +91,7 @@ describe('_mixins.scss', () => {
       $t: test($interactive-01);
     `);
 
-    const colors = calls.map(call => convert(call[0]));
+    const colors = calls.map((call) => convert(call[0]));
     expect(colors[0]).toEqual(colors[2]);
     expect(colors[1]).toBe('#ffffff');
   });
diff --git a/packages/themes/__tests__/theme-maps-test.js b/packages/themes/__tests__/theme-maps-test.js
index 53d8dd447f02..dbece1d4c66c 100644
--- a/packages/themes/__tests__/theme-maps-test.js
+++ b/packages/themes/__tests__/theme-maps-test.js
@@ -16,7 +16,7 @@ const render = createSassRenderer(__dirname);
 
 describe('_theme-maps.scss', () => {
   it('should export all themes as sass maps', async () => {
-    const themeMapsTests = Object.keys(themes).map(theme => {
+    const themeMapsTests = Object.keys(themes).map((theme) => {
       return `$t: test(global-variable-exists(carbon--theme--${theme}));`;
     });
     const { calls } = await render(`
diff --git a/packages/themes/__tests__/themes-test.js b/packages/themes/__tests__/themes-test.js
index 362fcd62c580..6bfdb9d73de0 100644
--- a/packages/themes/__tests__/themes-test.js
+++ b/packages/themes/__tests__/themes-test.js
@@ -17,7 +17,7 @@ const render = createSassRenderer(__dirname);
 const { white: defaultTheme } = themes;
 
 function flatten(tokens) {
-  return Object.keys(tokens).flatMap(group => tokens[group]);
+  return Object.keys(tokens).flatMap((group) => tokens[group]);
 }
 
 function formatObjectKeys(object) {
@@ -42,7 +42,7 @@ describe('themes.scss', () => {
   describe('tokens', () => {
     it.each(flatten(tokens))(
       '%s should match the default theme',
-      async token => {
+      async (token) => {
         const name = formatTokenName(token);
         const { calls } = await render(`
           @import '../scss/themes';
@@ -69,7 +69,7 @@ describe('themes.scss', () => {
       `);
       const theme = convert(calls[0][0]);
 
-      Object.keys(defaultTheme).forEach(token => {
+      Object.keys(defaultTheme).forEach((token) => {
         expect(defaultTheme[token]).toEqual(
           formatObjectKeys(theme[formatTokenName(token)])
         );
diff --git a/packages/themes/__tests__/tokens-test.js b/packages/themes/__tests__/tokens-test.js
index d0bfa9ff71a6..7a46cb758ba1 100644
--- a/packages/themes/__tests__/tokens-test.js
+++ b/packages/themes/__tests__/tokens-test.js
@@ -16,7 +16,7 @@ const render = createSassRenderer(__dirname);
 
 describe('_tokens.scss', () => {
   it('should export all tokens', async () => {
-    const tokenVariableTests = tokens.colors.map(token => {
+    const tokenVariableTests = tokens.colors.map((token) => {
       return `$t: test(global-variable-exists(${formatTokenName(token)}));`;
     });
     const { calls } = await render(`
diff --git a/packages/themes/src/__tests__/themes-test.js b/packages/themes/src/__tests__/themes-test.js
index 2664e701151e..c72819a25d29 100644
--- a/packages/themes/src/__tests__/themes-test.js
+++ b/packages/themes/src/__tests__/themes-test.js
@@ -14,18 +14,18 @@ const tokenList = Object.keys(tokens).reduce((acc, key) => {
 }, []);
 
 describe('themes', () => {
-  describe.each(Object.keys(themes))('%s', name => {
+  describe.each(Object.keys(themes))('%s', (name) => {
     const theme = themes[name];
 
     // Test to make sure that all tokens defined exist in the theme
-    test.each(tokenList)('%s should be defined', token => {
+    test.each(tokenList)('%s should be defined', (token) => {
       expect(theme[token]).toBeDefined();
     });
 
     // Test to make sure that all values in the them are actually tokens, useful
     // for catching a case where we have an extra token that should be in the
     // tokens export
-    test.each(Object.keys(theme))('%s should be a token', token => {
+    test.each(Object.keys(theme))('%s should be a token', (token) => {
       expect(tokenList.indexOf(token)).not.toBe(-1);
     });
   });
diff --git a/packages/themes/src/__tests__/tokens-test.js b/packages/themes/src/__tests__/tokens-test.js
index 899649059fb3..f9b8cdba2e1e 100644
--- a/packages/themes/src/__tests__/tokens-test.js
+++ b/packages/themes/src/__tests__/tokens-test.js
@@ -13,8 +13,8 @@ const { colors } = tokens;
 
 describe('tokens', () => {
   describe('colors', () => {
-    test.each(colors)('%s should be grouped in meta', color => {
-      const entry = meta.colors.find(group => {
+    test.each(colors)('%s should be grouped in meta', (color) => {
+      const entry = meta.colors.find((group) => {
         return group.tokens.includes(color);
       });
       expect(entry).toBeDefined();
diff --git a/packages/themes/src/__tests__/tools-test.js b/packages/themes/src/__tests__/tools-test.js
index 8553fca036eb..f50b8db195fd 100644
--- a/packages/themes/src/__tests__/tools-test.js
+++ b/packages/themes/src/__tests__/tools-test.js
@@ -16,26 +16,17 @@ describe('tools', () => {
     const SHIFT_AMOUNT = 5;
 
     const baseColor = Color(blue60);
-    const baseLightness = baseColor
-      .hsl()
-      .round()
-      .object().l;
+    const baseLightness = baseColor.hsl().round().object().l;
 
     it('should increase lightness by a specified amount', () => {
       const newColor = Color(adjustLightness(blue60, SHIFT_AMOUNT));
-      const newLightness = newColor
-        .hsl()
-        .round()
-        .object().l;
+      const newLightness = newColor.hsl().round().object().l;
       expect(newLightness).toEqual(baseLightness + SHIFT_AMOUNT);
     });
 
     it('should decrease lightness by a specified amount when given a negative shift', () => {
       const newColor = Color(adjustLightness(blue60, SHIFT_AMOUNT * -1));
-      const newLightness = newColor
-        .hsl()
-        .round()
-        .object().l;
+      const newLightness = newColor.hsl().round().object().l;
 
       expect(newLightness).toEqual(baseLightness - SHIFT_AMOUNT);
     });
diff --git a/packages/themes/src/tools.js b/packages/themes/src/tools.js
index c19d2e0d8c90..926fe48b4171 100644
--- a/packages/themes/src/tools.js
+++ b/packages/themes/src/tools.js
@@ -16,9 +16,7 @@ import Color from 'color';
  * @returns {string}
  */
 export function adjustLightness(token, shift) {
-  const original = Color(token)
-    .hsl()
-    .object();
+  const original = Color(token).hsl().object();
 
   return Color({ ...original, l: (original.l += shift) })
     .round()
diff --git a/packages/themes/tasks/build.js b/packages/themes/tasks/build.js
index 8a26801d1d0e..b0e62090ce95 100644
--- a/packages/themes/tasks/build.js
+++ b/packages/themes/tasks/build.js
@@ -81,12 +81,12 @@ async function build() {
  */
 function transformMetadata(metadata) {
   const namesRegEx = new RegExp(
-    metadata.tokens.map(token => token.name).join('|'),
+    metadata.tokens.map((token) => token.name).join('|'),
     'g'
   );
 
   const replaceMap = {};
-  metadata.tokens.map(token => {
+  metadata.tokens.map((token) => {
     replaceMap[token.name] = formatTokenName(token.name);
   });
 
@@ -94,7 +94,7 @@ function transformMetadata(metadata) {
     // interactive01 to `$interactive-01`
     if (token.role) {
       token.role.forEach((role, j) => {
-        metadata.tokens[i].role[j] = role.replace(namesRegEx, match => {
+        metadata.tokens[i].role[j] = role.replace(namesRegEx, (match) => {
           return '`$' + replaceMap[match] + '`';
         });
       });
@@ -109,7 +109,7 @@ function transformMetadata(metadata) {
   return metadata;
 }
 
-build().catch(error => {
+build().catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/themes/tasks/builders/mixins.js b/packages/themes/tasks/builders/mixins.js
index 903dd645717d..cad2cc295f3d 100644
--- a/packages/themes/tasks/builders/mixins.js
+++ b/packages/themes/tasks/builders/mixins.js
@@ -66,8 +66,8 @@ function buildMixinsFile(themes, tokens, defaultTheme, defaultThemeMapName) {
           init: t.Identifier('theme'),
           global: true,
         }),
-        ...Object.keys(tokens).flatMap(group => {
-          return tokens[group].flatMap(token => {
+        ...Object.keys(tokens).flatMap((group) => {
+          return tokens[group].flatMap((token) => {
             const name = formatTokenName(token);
 
             return t.Assignment({
@@ -92,15 +92,15 @@ function buildMixinsFile(themes, tokens, defaultTheme, defaultThemeMapName) {
             ]),
           }),
           consequent: t.BlockStatement(
-            Object.keys(tokens).flatMap(group => {
+            Object.keys(tokens).flatMap((group) => {
               return tokens[group]
-                .filter(token => {
+                .filter((token) => {
                   // We don't want to inline CSS Custom Properties for tokens
                   // that are maps, we'll need to use a corresponding mixin for
                   // that token to embed CSS Custom Properties
                   return typeof themes[defaultTheme][token] !== 'object';
                 })
-                .flatMap(token => {
+                .flatMap((token) => {
                   const name = formatTokenName(token);
                   return t.Assignment({
                     id: t.Identifier(name),
@@ -132,8 +132,8 @@ function buildMixinsFile(themes, tokens, defaultTheme, defaultThemeMapName) {
             right: t.SassBoolean(true),
           }),
           consequent: t.BlockStatement(
-            Object.keys(tokens).flatMap(group => {
-              return tokens[group].flatMap(token => {
+            Object.keys(tokens).flatMap((group) => {
+              return tokens[group].flatMap((token) => {
                 const name = formatTokenName(token);
                 return [
                   t.Newline(),
diff --git a/packages/themes/tasks/builders/shared.js b/packages/themes/tasks/builders/shared.js
index 7f08a30029d1..267d8c6a30c1 100644
--- a/packages/themes/tasks/builders/shared.js
+++ b/packages/themes/tasks/builders/shared.js
@@ -44,7 +44,7 @@ function primitive(value) {
   }
   if (typeof value === 'object') {
     return t.SassMap({
-      properties: Object.keys(value).map(key => {
+      properties: Object.keys(value).map((key) => {
         const quoted = key.includes(' ');
         const identifier = quoted
           ? t.Identifier(key)
diff --git a/packages/themes/tasks/builders/themes.js b/packages/themes/tasks/builders/themes.js
index de82579901c8..4110f92a23c9 100644
--- a/packages/themes/tasks/builders/themes.js
+++ b/packages/themes/tasks/builders/themes.js
@@ -21,7 +21,7 @@ function buildThemesFile(
   const defaultThemeMap = t.Assignment({
     id: t.Identifier(`carbon--theme--${defaultThemeName}`),
     init: t.SassMap({
-      properties: Object.keys(defaultTheme).map(token => {
+      properties: Object.keys(defaultTheme).map((token) => {
         return t.SassMapProperty(
           t.Identifier(formatTokenName(token)),
           primitive(defaultTheme[token])
@@ -31,8 +31,8 @@ function buildThemesFile(
     default: true,
   });
   const themeMaps = Object.keys(themes)
-    .filter(name => name !== defaultThemeName)
-    .flatMap(name => {
+    .filter((name) => name !== defaultThemeName)
+    .flatMap((name) => {
       const theme = themes[name];
       const comment = t.Comment(`/ Carbon's ${name} color theme
 / @type Map
@@ -47,10 +47,10 @@ function buildThemesFile(
             t.Identifier(`carbon--theme--${defaultThemeName}`),
             t.SassMap({
               properties: Object.keys(theme)
-                .filter(token => {
+                .filter((token) => {
                   return theme[token] !== defaultTheme[token];
                 })
-                .map(token => {
+                .map((token) => {
                   return t.SassMapProperty(
                     t.Identifier(formatTokenName(token)),
                     primitive(theme[token])
@@ -66,8 +66,8 @@ function buildThemesFile(
   const carbonTheme = t.Assignment({
     id: t.Identifier(defaultThemeMapName),
     init: t.SassMap({
-      properties: Object.keys(tokens).flatMap(group => {
-        return tokens[group].flatMap(token => {
+      properties: Object.keys(tokens).flatMap((group) => {
+        return tokens[group].flatMap((token) => {
           const name = formatTokenName(token);
           return t.SassMapProperty(
             t.Identifier(name),
diff --git a/packages/themes/tasks/builders/tokens.js b/packages/themes/tasks/builders/tokens.js
index 8de0f4e70385..37ab1bc122c3 100644
--- a/packages/themes/tasks/builders/tokens.js
+++ b/packages/themes/tasks/builders/tokens.js
@@ -31,12 +31,12 @@ function buildTokensFile(tokens, metadata, defaultTheme) {
     layout: 'Number',
   };
 
-  const assignments = Object.keys(tokens).flatMap(group => {
-    return tokens[group].flatMap(token => {
+  const assignments = Object.keys(tokens).flatMap((group) => {
+    return tokens[group].flatMap((token) => {
       const name = formatTokenName(token);
       const tokenData =
         (metadata.tokens &&
-          metadata.tokens.find(tok => {
+          metadata.tokens.find((tok) => {
             return tok.name === token;
           })) ||
         {};
diff --git a/packages/type/__tests__/scss-test.js b/packages/type/__tests__/scss-test.js
index a9fd079056ed..34ec1decfb9b 100644
--- a/packages/type/__tests__/scss-test.js
+++ b/packages/type/__tests__/scss-test.js
@@ -35,7 +35,7 @@ describe('type.scss', () => {
 
       expect(style.length).toBe(Object.keys(productiveHeading01).length);
 
-      Object.keys(productiveHeading01).forEach(key => {
+      Object.keys(productiveHeading01).forEach((key) => {
         const property = paramCase(key);
         // We stringify the value from JS due to the fact that most of these
         // values (like numbers) are represented as strings when we get the
diff --git a/packages/type/src/__tests__/styles-test.js b/packages/type/src/__tests__/styles-test.js
index 17e27a7e7345..664feb88d229 100644
--- a/packages/type/src/__tests__/styles-test.js
+++ b/packages/type/src/__tests__/styles-test.js
@@ -11,7 +11,7 @@ import * as tokens from '../styles';
 import { print } from '../print';
 
 describe('styles', () => {
-  test.each(Object.keys(tokens))('%s should be printable', key => {
+  test.each(Object.keys(tokens))('%s should be printable', (key) => {
     const token = tokens[key];
     expect(print(token)).toMatchSnapshot();
   });
diff --git a/packages/type/src/__tests__/tokens-test.js b/packages/type/src/__tests__/tokens-test.js
index a2720ec42a51..7af23a00caa8 100644
--- a/packages/type/src/__tests__/tokens-test.js
+++ b/packages/type/src/__tests__/tokens-test.js
@@ -11,11 +11,11 @@ import { unstable_tokens as tokens } from '../tokens';
 import * as styles from '../styles';
 
 describe('type tokens', () => {
-  test.each(tokens)('%s should be defined in styles', token => {
+  test.each(tokens)('%s should be defined in styles', (token) => {
     expect(styles[token]).toBeDefined();
   });
 
-  test.each(Object.keys(styles))('%s should be defined in tokens', token => {
+  test.each(Object.keys(styles))('%s should be defined in tokens', (token) => {
     expect(tokens.indexOf(token)).not.toBe(-1);
   });
 });
diff --git a/packages/type/src/fluid.js b/packages/type/src/fluid.js
index 76b2fec2bb1d..120fcc4731e3 100644
--- a/packages/type/src/fluid.js
+++ b/packages/type/src/fluid.js
@@ -27,7 +27,7 @@ export function fluid(selector) {
 
   styles.fontSize = fluidTypeSize(styles, 'sm', fluidBreakpoints);
 
-  fluidBreakpointNames.forEach(name => {
+  fluidBreakpointNames.forEach((name) => {
     styles[bp(name)] = {
       ...fluidBreakpoints[name],
       fontSize: fluidTypeSize(styles, name, fluidBreakpoints),
diff --git a/packages/upgrade/bin/carbon-upgrade.js b/packages/upgrade/bin/carbon-upgrade.js
index 2129a876b8dd..3601927ffd76 100755
--- a/packages/upgrade/bin/carbon-upgrade.js
+++ b/packages/upgrade/bin/carbon-upgrade.js
@@ -17,7 +17,7 @@
 // Makes the script crash on unhandled rejections instead of silently
 // ignoring them. In the future, promise rejections that are not handled will
 // terminate the Node.js process with a non-zero exit code.
-process.on('unhandledRejection', error => {
+process.on('unhandledRejection', (error) => {
   console.error(error);
 });
 
@@ -40,7 +40,7 @@ if (major < 8) {
 
 var main = require('../src/cli');
 
-main(process).catch(error => {
+main(process).catch((error) => {
   console.error(error);
   process.exit(1);
 });
diff --git a/packages/upgrade/src/cli.js b/packages/upgrade/src/cli.js
index 7a6a365b8caa..6cdebdb46681 100644
--- a/packages/upgrade/src/cli.js
+++ b/packages/upgrade/src/cli.js
@@ -39,7 +39,7 @@ async function main({ argv, cwd }) {
 
   cli
     .usage('Usage: $0 [options]')
-    .command('$0', 'run to upgrade your project', {}, async args => {
+    .command('$0', 'run to upgrade your project', {}, async (args) => {
       const { dry, ignore, verbose } = args;
       const options = {
         cwd: cwd(),
@@ -55,7 +55,7 @@ async function main({ argv, cwd }) {
     'migrate <package> <from> <to>',
     'run a specific migration for a package',
     {},
-    async args => {
+    async (args) => {
       const { dry, from, ignore, package: packageName, to, verbose } = args;
       const options = {
         cwd: cwd(),
@@ -68,11 +68,7 @@ async function main({ argv, cwd }) {
     }
   );
 
-  cli
-    .demandCommand()
-    .recommendCommands()
-    .strict()
-    .parse(argv.slice(2)).argv;
+  cli.demandCommand().recommendCommands().strict().parse(argv.slice(2)).argv;
 }
 
 async function runCommand(makePromise, options) {
diff --git a/packages/upgrade/src/migrations/carbon-elements/0.0.1-alpha.32.js b/packages/upgrade/src/migrations/carbon-elements/0.0.1-alpha.32.js
index 3a57031d65a5..7d81ff4514fa 100644
--- a/packages/upgrade/src/migrations/carbon-elements/0.0.1-alpha.32.js
+++ b/packages/upgrade/src/migrations/carbon-elements/0.0.1-alpha.32.js
@@ -27,7 +27,7 @@ module.exports = {
           ...motion.from,
         ].filter(({ version }) => version === '<=0.0.1-alpha.31');
         await Promise.all(
-          migrations.map(migration => migration.migrate(options))
+          migrations.map((migration) => migration.migrate(options))
         );
       },
     },
diff --git a/packages/upgrade/src/migrations/carbon-icons-react/10.3.0/update-icon-import-path.js b/packages/upgrade/src/migrations/carbon-icons-react/10.3.0/update-icon-import-path.js
index 8ccb1125c16d..382ab8430072 100644
--- a/packages/upgrade/src/migrations/carbon-icons-react/10.3.0/update-icon-import-path.js
+++ b/packages/upgrade/src/migrations/carbon-icons-react/10.3.0/update-icon-import-path.js
@@ -44,8 +44,8 @@ module.exports = (file, api) => {
   //   import IconName from '@carbon/icons-react/<bundle>/<name>/<size>';
   root
     .find(j.ImportDeclaration)
-    .filter(path => path.value.source.value.includes('@carbon/icons-react'))
-    .forEach(path => {
+    .filter((path) => path.value.source.value.includes('@carbon/icons-react'))
+    .forEach((path) => {
       // For each node that we encounter that has `@carbon/icons-react` in the
       // import source, we need to slice off the first chunks from the value and
       // then capture all the icon-specific data. Depending on the length of
@@ -142,7 +142,7 @@ module.exports = (file, api) => {
 
   // Finally, go through our program and insert our icon import declaration into
   // the index specified by `importIndex`
-  root.find(j.Program).forEach(path => {
+  root.find(j.Program).forEach((path) => {
     const { node } = path;
     node.body = [
       ...node.body.slice(0, importIndex),
@@ -163,7 +163,7 @@ module.exports = (file, api) => {
 
 function getModuleName(name, size, prefixParts) {
   const prefix = prefixParts
-    .filter(size => isNaN(size))
+    .filter((size) => isNaN(size))
     .map(pascalCase)
     .join('');
 
diff --git a/packages/upgrade/src/runner.js b/packages/upgrade/src/runner.js
index f7d1d02edd87..d6307fc18f1c 100644
--- a/packages/upgrade/src/runner.js
+++ b/packages/upgrade/src/runner.js
@@ -26,10 +26,10 @@ async function run(packageName, from, to, options) {
   }
 
   const packageMigrations = supportedPackages.get(packageName);
-  const migrationsForVersion = find(packageMigrations, versionMigration => {
+  const migrationsForVersion = find(packageMigrations, (versionMigration) => {
     return versionMigration.version === to;
   });
-  const migration = migrationsForVersion.from.find(migration => {
+  const migration = migrationsForVersion.from.find((migration) => {
     return semver.intersects(migration.version, from);
   });
 
@@ -69,17 +69,17 @@ async function runInDirectory(options) {
     peerDependencies = {},
   } = packageJson;
   const packageDependencies = [
-    ...Object.keys(dependencies).map(name => ({
+    ...Object.keys(dependencies).map((name) => ({
       name,
       version: dependencies[name],
       type: 'dependencies',
     })),
-    ...Object.keys(devDependencies).map(name => ({
+    ...Object.keys(devDependencies).map((name) => ({
       name,
       version: devDependencies[name],
       type: 'devDependencies',
     })),
-    ...Object.keys(peerDependencies).map(name => ({
+    ...Object.keys(peerDependencies).map((name) => ({
       name,
       version: peerDependencies[name],
       type: 'peerDependencies',
@@ -91,7 +91,7 @@ async function runInDirectory(options) {
       }
       return acc.concat(pkg);
     }, [])
-    .filter(pkg => supportedPackages.has(pkg.name));
+    .filter((pkg) => supportedPackages.has(pkg.name));
 
   if (packageDependencies.length === 0) {
     reporter.info(
@@ -101,7 +101,7 @@ async function runInDirectory(options) {
     process.exit(1);
   }
 
-  const questions = packageDependencies.map(dependency => {
+  const questions = packageDependencies.map((dependency) => {
     const { name, version } = dependency;
     const supportedVersions = supportedPackages.get(name);
 
@@ -110,10 +110,10 @@ async function runInDirectory(options) {
       type: 'list',
       message: `Choose which version you would like to migrate to for ${name}`,
       choices: [...supportedVersions]
-        .filter(supportedVersion => {
+        .filter((supportedVersion) => {
           return semver.gt(supportedVersion.version, version);
         })
-        .map(supportedVersion => ({
+        .map((supportedVersion) => ({
           name: supportedVersion.version,
         })),
     };
@@ -124,7 +124,7 @@ async function runInDirectory(options) {
 
   for (const name of Object.keys(answers)) {
     const dependency = packageDependencies.find(
-      dependency => dependency.name === name
+      (dependency) => dependency.name === name
     );
     const to = answers[name];
 
diff --git a/packages/upgrade/src/tools/replace.js b/packages/upgrade/src/tools/replace.js
index 5dcde379a4fb..c073aea51c52 100644
--- a/packages/upgrade/src/tools/replace.js
+++ b/packages/upgrade/src/tools/replace.js
@@ -23,7 +23,9 @@ async function replace(globs, changes, options) {
     ignore: ['node_modules', ...ignore].filter(Boolean),
   });
 
-  return Promise.all(files.map(file => replaceInFile(file, changes, options)));
+  return Promise.all(
+    files.map((file) => replaceInFile(file, changes, options))
+  );
 }
 
 const diffOptions = {
diff --git a/packages/upgrade/src/tools/safeAsync.js b/packages/upgrade/src/tools/safeAsync.js
index 7107f3eee72d..bb99a111c67a 100644
--- a/packages/upgrade/src/tools/safeAsync.js
+++ b/packages/upgrade/src/tools/safeAsync.js
@@ -8,10 +8,10 @@
 'use strict';
 
 function safeAsync(promise) {
-  return new Promise(resolve => {
+  return new Promise((resolve) => {
     promise
       .then((...args) => resolve([args, null]))
-      .catch(error => [null, error]);
+      .catch((error) => [null, error]);
   });
 }
 
diff --git a/packages/upgrade/src/tools/spawn.js b/packages/upgrade/src/tools/spawn.js
index ecc8c9caf4e0..a9183600a3a2 100644
--- a/packages/upgrade/src/tools/spawn.js
+++ b/packages/upgrade/src/tools/spawn.js
@@ -19,18 +19,18 @@ function spawnAsync(command, args, options) {
     let stderr = '';
 
     if (child.stdout) {
-      child.stdout.on('data', data => {
+      child.stdout.on('data', (data) => {
         stdout += `${data}`;
       });
     }
 
     if (child.stderr) {
-      child.stderr.on('data', data => {
+      child.stderr.on('data', (data) => {
         stderr += `${data}`;
       });
     }
 
-    child.on('close', code => {
+    child.on('close', (code) => {
       if (code !== 0) {
         reject(stderr || defaultStderr);
         return;
@@ -38,7 +38,7 @@ function spawnAsync(command, args, options) {
       resolve(stdout);
     });
 
-    child.on('error', error => {
+    child.on('error', (error) => {
       reject(error);
       return;
     });
diff --git a/packages/upgrade/src/tools/testing.js b/packages/upgrade/src/tools/testing.js
index 65dd0354b18a..56f3c00e6924 100644
--- a/packages/upgrade/src/tools/testing.js
+++ b/packages/upgrade/src/tools/testing.js
@@ -47,7 +47,7 @@ function defineInlineTest(
 
     const migrations = require(pathToMigrations);
 
-    [migration] = migrations.from.filter(migration => {
+    [migration] = migrations.from.filter((migration) => {
       return semver.satisfies(version, migration.version);
     });
     if (!migration) {
diff --git a/tasks/examples.js b/tasks/examples.js
index 1704ad21f40f..c51d7f69852c 100644
--- a/tasks/examples.js
+++ b/tasks/examples.js
@@ -46,8 +46,8 @@ async function main() {
 
   const packages = await Promise.all(
     packageNames
-      .filter(name => PACKAGES_TO_BUILD.has(name))
-      .map(async name => {
+      .filter((name) => PACKAGES_TO_BUILD.has(name))
+      .map(async (name) => {
         // Verify that each file that we read from the packages directory is
         // actually a folder. Typically used to catch `.DS_store` files that
         // accidentally appear when opening with MacOS Finder
@@ -68,13 +68,13 @@ async function main() {
           return descriptor;
         }
 
-        const examples = (await fs.readdir(examplesDir)).filter(example => {
+        const examples = (await fs.readdir(examplesDir)).filter((example) => {
           return example !== '.yarnrc' && !IGNORE_EXAMPLE_DIRS.has(example);
         });
 
         return {
           ...descriptor,
-          examples: examples.map(name => ({
+          examples: examples.map((name) => ({
             filepath: path.join(examplesDir, name),
             name,
           })),
@@ -83,11 +83,11 @@ async function main() {
   );
 
   const packagesWithExamples = packages.filter(
-    pkg => Array.isArray(pkg.examples) && pkg.examples.length !== 0
+    (pkg) => Array.isArray(pkg.examples) && pkg.examples.length !== 0
   );
 
   await Promise.all(
-    packagesWithExamples.map(async pkg => {
+    packagesWithExamples.map(async (pkg) => {
       reporter.info(`Building examples in package \`${pkg.name}\``);
 
       const { examples, filepath, name } = pkg;
@@ -96,7 +96,7 @@ async function main() {
       await fs.ensureDir(packageDir);
 
       await Promise.all(
-        examples.map(async example => {
+        examples.map(async (example) => {
           reporter.info(
             `Building example \`${example.name}\` in package \`${pkg.name}\``
           );
@@ -188,6 +188,6 @@ async function main() {
   );
 }
 
-main().catch(error => {
+main().catch((error) => {
   console.log(error);
 });
diff --git a/tasks/jest/matchers/toHaveNoAxeViolations.js b/tasks/jest/matchers/toHaveNoAxeViolations.js
index fd8af8a3a2c5..bee9e29d5be0 100644
--- a/tasks/jest/matchers/toHaveNoAxeViolations.js
+++ b/tasks/jest/matchers/toHaveNoAxeViolations.js
@@ -30,7 +30,7 @@ const defaultOptions = {
 };
 
 function toHaveNoAxeViolations(node, options = {}) {
-  return new Promise(resolve => {
+  return new Promise((resolve) => {
     axe.run(
       node,
       {
@@ -61,7 +61,7 @@ function toHaveNoAxeViolations(node, options = {}) {
 function formatOutput(violations) {
   const firstViolation = violations[0];
   const { description, id, impact, help, helpUrl } = firstViolation;
-  const nodes = firstViolation.nodes.map(node => {
+  const nodes = firstViolation.nodes.map((node) => {
     return ['Node:', node.html, '\n', ...node.failureSummary.split('\n')].join(
       '\n'
     );
diff --git a/tasks/jest/setupAfterEnv.js b/tasks/jest/setupAfterEnv.js
index 1d0764baf28b..c04a417cd8b0 100644
--- a/tasks/jest/setupAfterEnv.js
+++ b/tasks/jest/setupAfterEnv.js
@@ -40,7 +40,7 @@ const consoleMethods = ['error', 'warn', process.env.CI && 'log'].filter(
 
 for (const methodName of consoleMethods) {
   const unexpectedConsoleCallStacks = [];
-  const newMethod = function(format, ...args) {
+  const newMethod = function (format, ...args) {
     const stack = new Error().stack;
     unexpectedConsoleCallStacks.push([
       stack.substr(stack.indexOf('\n') + 1),
@@ -65,7 +65,7 @@ for (const methodName of consoleMethods) {
           `${message}\n` +
           `${stack
             .split('\n')
-            .map(line => chalk.gray(line))
+            .map((line) => chalk.gray(line))
             .join('\n')}`
       );
       const message = `Expected test not to call ${chalk.bold(
diff --git a/tasks/sync.js b/tasks/sync.js
index f877c65f42e6..a43401d3f18f 100644
--- a/tasks/sync.js
+++ b/tasks/sync.js
@@ -81,7 +81,7 @@ function sortFields(a, b) {
 
 async function sync() {
   const packagePaths = await Promise.all(
-    (await fs.readdir(PACKAGES_DIR)).map(async pkg => {
+    (await fs.readdir(PACKAGES_DIR)).map(async (pkg) => {
       const packageJsonPath = path.join(PACKAGES_DIR, pkg, 'package.json');
       return {
         basename: pkg,
@@ -102,7 +102,7 @@ async function sync() {
       };
 
       if (Array.isArray(file.keywords)) {
-        const keywordsToAdd = DEFAULT_KEYWORDS.filter(keyword => {
+        const keywordsToAdd = DEFAULT_KEYWORDS.filter((keyword) => {
           return file.keywords.indexOf(keyword) === -1;
         });
         if (keywordsToAdd.length > 0) {
@@ -147,7 +147,7 @@ async function sync() {
 
       if (await fs.pathExists(ignorePath)) {
         const ignoreFile = await fs.readFile(ignorePath, 'utf8');
-        const localIgnorePatterns = ignoreFile.split('\n').filter(pattern => {
+        const localIgnorePatterns = ignoreFile.split('\n').filter((pattern) => {
           return ignorePatterns.indexOf(pattern) === -1;
         });
 
@@ -159,4 +159,4 @@ async function sync() {
   );
 }
 
-sync().catch(error => console.error(error));
+sync().catch((error) => console.error(error));
diff --git a/yarn.lock b/yarn.lock
index 1ef1ca55b483..095f949df42f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -18584,11 +18584,16 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@^1.16.4, prettier@^1.19.1:
+prettier@^1.16.4:
   version "1.19.1"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.19.1.tgz#f7d7f5ff8a9cd872a7be4ca142095956a60797cb"
   integrity sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==
 
+prettier@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.0.5.tgz#d6d56282455243f2f92cc1716692c08aa31522d4"
+  integrity sha512-7PtVymN48hGcO4fGjybyBSIWDsLU4H4XlvOHfq91pz9kkGlonzwTfYkaIEwiRg/dAJF9YlbsduBAgtYLi+8cFg==
+
 pretty-error@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-2.1.1.tgz#5f4f87c8f91e5ae3f3ba87ab4cf5e03b1a17f1a3"