### Starts the server

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Starts the server (not needed for testing).

```shell
yarn start
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/style-compiler/README.md

Install the @lwc/style-compiler package as a dev dependency.

```sh
yarn add --dev @lwc/style-compiler
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/rollup-plugin/README.md

Install the @lwc/rollup-plugin using yarn.

```sh
yarn add --dev @lwc/rollup-plugin
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/template-compiler/README.md

Install the @lwc/template-compiler package as a dev dependency.

```sh
yarn add --dev @lwc/template-compiler
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/babel-plugin-component/README.md

Install the babel core and the LWC component babel plugin.

```bash
npm install babel @lwc/babel-plugin-component
```

--------------------------------

### Install Dependencies

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Installs project dependencies using Yarn.

```bash
yarn install
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/compiler/README.md

Install the @lwc/compiler package using npm.

```sh
npm install @lwc/compiler
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/aria-reflection/README.md

Install the @lwc/aria-reflection package using npm.

```shell
npm install @lwc/aria-reflection
```

--------------------------------

### Module Resolution Configuration Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/module-resolver/README.md

Example of lwc.config.json file configuring module resolution with alias, directory, and NPM package records.

```json
// lwc.config.json
{
    "modules": [
        {
            "name": "ui/button",
            "path": "src/modules/ui/button/button.js"
        },
        {
            "dir": "src/modules"
        },
        {
            "npm": "@ui/components"
        }
    ]
}
```

--------------------------------

### Usage Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/template-compiler/README.md

Example of how to use the compile function from the @lwc/template-compiler package.

```js
import { compile } from '@lwc/template-compiler';

const filename = 'component.html';
const options = {};
const { code, warnings } = compile(
    `
    <template>
        <h1>Hello World!</h1>
    </template>
`,
    filename,
    options
);

for (let warning of warnings) {
    console.log(warning.message);
}

console.log(code);
```

--------------------------------

### Importing from 'lwc/engine-server'

Source: https://github.com/salesforce/lwc/blob/master/packages/lwc/README.md

Example of importing a module from the convenience 'lwc' package.

```js
import { renderComponent } from 'lwc/engine-server';
```

--------------------------------

### Compile API Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/template-compiler/README.md

Example of using the compile API with minimal options.

```js
import { compile } from '@lwc/template-compiler';
const { code, warnings } = compile(`<template><h1>Hello World!</h1></template>`, {});
```

--------------------------------

### Manual Testing Setup

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Command to set up and run a benchmark for manual testing in Chrome DevTools.

```shell
cd packages/@lwc/perf-benchmarks
yarn tach --manual --config dist/__benchmarks__/path/to/tachometer.json
```

--------------------------------

### Creating a ReactiveObserver instance

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/src/libs/mutation-tracker/README.md

This example shows how to create a ReactiveObserver and observe property access.

```javascript
import { ReactiveObserver } from '../libs/mutation-tracker';
const ro = new ReactiveObserver(() => {
    // this callback will be called when tracked property `x` of `o`
    // is mutated via `valueMutated` in the future.
});
ro.observe(() => {
    // every time observe() is invoked, the callback will be immediately
    // called, and any observed value will be recorded and linked to this
    // ReactiveObserver instance, in case a mutation happens in the future.
    valueObserved(o, 'x');
});
```

--------------------------------

### LightningElement base class example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/README.md

Provides an example of extending the LightningElement class to create an LWC constructor.

```js
import { LightningElement } from 'lwc';

class LightningHello extends LightningElement {
    // component implementation
}
```

--------------------------------

### Installation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/module-resolver/README.md

Install the @lwc/module-resolver package as a dev dependency.

```sh
npm install --save-dev @lwc/module-resolver
```

--------------------------------

### Directory Module Record Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/module-resolver/README.md

Example of a directory module record specifying a folder path for module resolution.

```json
{
    "modules": [
        {
            "dir": "src/modules"
        }
    ]
}
```

--------------------------------

### Alias Module Record Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/module-resolver/README.md

Example of an alias module record mapping a module specifier to a file path.

```json
{
    "modules": [
        {
            "name": "ui/button",
            "path": "src/modules/ui/button/button.js"
        }
    ]
}
```

--------------------------------

### Example Commit Message (Docs)

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

An example of a commit message for documentation changes.

```git
docs(changelog): update change log to beta.5
```

--------------------------------

### getBook wire adapter implementation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/wire-service/README.md

An example implementation of a wire adapter named getBook, demonstrating connect, disconnect, and update methods.

```javascript
// wire-adapter.js
import { bookEndpoint } from './server';

export class getBook {
    connected = false;
    bookId;

    constructor(dataCallback) {
        this.dataCallback = dataCallback;
    }

    connect() {
        this.connected = true;
        this.provideBookWithId(this.bookId);
    }

    disconnect() {
        this.connected = false;
    }

    update(config) {
        if (this.bookId !== config.id) {
            this.bookId = config.id;
            this.provideBookWithId(this.bookId);
        }
    }

    provideBookWithId(id) {
        if (this.connected && this.bookId !== undefined) {
            const book = bookEndpoint.getById(id);

            if (book) {
                this.dataCallback(Object.assign({}, book));
            } else {
                this.dataCallback(null);
            }
        }
    }
}
```

--------------------------------

### Usage

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/style-compiler/README.md

Example of using the transform function from the @lwc/style-compiler package.

```js
import { transform } from '@lwc/style-compiler';

const source = `
    :host {
        opacity: 0.4;
    }

    span {
        text-transform: uppercase;
    }
`;

const { code } = transform(source, 'example.css');
```

--------------------------------

### Usage

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/rollup-plugin/README.md

Example rollup.config.js configuration using the @lwc/rollup-plugin.

```js
// rollup.config.js
import lwc from '@lwc/rollup-plugin';

export default {
    input: './src/main.js',
    plugins: [lwc()],
};

```

--------------------------------

### @wire decorator example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/README.md

Shows how to use the @wire decorator to wire fields and methods to a wire adapter.

```js
import { LightningElement, wire } from 'lwc';
import { getRecord } from 'recordDataService';

export default class Test extends LightningElement {
    @wire(getRecord, { id: 1 })
    recordData;
}
```

--------------------------------

### Usage

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/babel-plugin-component/README.md

Example of using the @lwc/babel-plugin-component with @babel/core.

```javascript
import babel from '@babel/core';
import lwcPlugin from '@lwc/babel-plugin-component';

const source = `
import { LightningElement } from 'lwc';
export default class extends LightningElement {}`;

const { code } = babel.transformSync(source, {
    plugins: [
        [
            lwcPlugin,
            {
                /* options */
            },
        ],
    ],
});
```

--------------------------------

### Directory structure for contributing tests

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Example directory structure for contributing tests, emphasizing one repro per test case.

```shell
lwc-integration/src/components/<functional-area>
--<specific-repro>
----<specific-repro>
------<specific-repro>.html
------<specific-repro>.js
----app
------app.html
------app.js
----child
------child.html
------child.js
----<specific-repro>.spec.js
```

```shell
lwc-integration/src/components/<functional-area>
--<specific-repro>
----<specific-repro>.html
----<specific-repro>.js
----<specific-repro>.spec.js
```

--------------------------------

### Pull Request Title Format Example

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Example of the conventional commit format for pull request titles.

```shell
ex:
commit-type(optional scope): commit description. ( NOTE: space between column and the message )

Types: build, chore, ci, docs, feat, fix, perf, refactor, revert, style, test, proposal.
Scope: The scope should be the name of the npm package affected (engine, compiler, wire-service, etc.)
```

--------------------------------

### Dev / watch mode

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Starts the development server in watch mode for continuous building.

```bash
yarn dev
```

--------------------------------

### Force Clean NPM Install

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Flag to use when comparing to another branch if issues arise, ensuring a clean npm install.

```shell
--force-clean-npm-install
```

--------------------------------

### Example Commit Message (Fix)

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

An example of a commit message for a bug fix, including a body explaining the motivation.

```git
fix(release): need to depend on latest rxjs and zone.js

The version in our package.json gets copied to the one we publish, and users need the latest of these.
```

--------------------------------

### Scoped Styles Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/ssr-compiler/src/__tests__/fixtures/light-dom-scoped-styles/expected.html

Example of CSS rules applied with scoped styles in Light DOM.

```css
p {color: red;} p.lwc-1rssj1tib70 {background-color: blue;}.lwc-1rssj1tib70-host {display: block;border: 1px solid black;}
```

--------------------------------

### ARIA Reflection Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/aria-reflection/README.md

Demonstrates how aria attributes are reflected to properties and vice versa.

```javascript
element.setAttribute('aria-pressed', 'true');
console.log(element.ariaPressed); // true
element.ariaPressed = false;
console.log(element.getAttribute('aria-pressed')); // false
```

--------------------------------

### Filter Benchmarks with GREP

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Example of using the GREP environment variable to filter benchmarks by filename using regular expressions.

```shell
GREP='ssr' yarn test
```

--------------------------------

### Custom Renderer Config Example 1

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/template-compiler/README.md

Configuration to match '<use>' elements under the 'svg' namespace and have 'href' attribute set.

```js
{
    customRendererConfig: {
        directives: [],
        elements: [
            {
                tagName: 'use',
                namespace: 'http://www.w3.org/2000/svg',
                attributes: ['href']
            }
        ]
    }
}
```

--------------------------------

### Custom Renderer Config Example 2

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/template-compiler/README.md

Configuration to match '<script>' elements regardless of the attribute set. Note: When 'attributes' is not specified, attribute matching is skipped.

```js
{
    customRendererConfig: {
        directives: [],
        elements: [
            {
                tagName: 'script'
            }
        ]
    }
}
```

--------------------------------

### @api decorator example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/README.md

Demonstrates the usage of the @api decorator to mark public fields in an LWC component.

```js
import { LightningElement, api } from 'lwc';

class LightningHello extends LightningElement {
    @api
    hello = 'default hello';
}
```

--------------------------------

### Exposing LWC Modules via NPM Packages

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/module-resolver/README.md

This example shows how to configure an NPM package to expose specific LWC modules publicly. The 'expose' key lists the public modules, and the 'modules.dir' specifies the directory containing these modules.

```json
{
    "modules": [
        {
            "dir": "src/modules"
        }
    ],
    "expose": ["ui/button", "ui/icon"]
}
```

--------------------------------

### @track decorator example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/README.md

Illustrates the use of the @track decorator for private fields to track object mutations.

```js
import { LightningElement, api, track } from 'lwc';

class LightningHello extends LightningElement {
    @api
    get name() {
        return name.raw;
    }
    set name(value) {
        name.normalized = normalize(value);
    }

    @track
    name = {
        raw: 'Web components ',
        normalized: 'Web Components',
    };
}
```

--------------------------------

### Component Importing HTML and CSS

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/types/README.md

Example of a component script importing its associated CSS stylesheet and HTML template.

```typescript
// my-component.ts
import stylesheet from './my-component.css';
import template from './my-component.html';
```

--------------------------------

### NPM Package Module Record Example

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/module-resolver/README.md

This JSON configuration tells the LWC module resolver to look into the '@ui/components' NPM package for resolvable LWC modules.

```json
{
    "modules": [
        {
            "npm": "@ui/components"
        }
    ]
}
```

--------------------------------

### Download the repository

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Clones the LWC repository from GitHub.

```bash
git clone git@github.com:salesforce/lwc.git
```

--------------------------------

### Build and Run Benchmarks Locally

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Commands to build the performance benchmarks and then run them locally.

```shell
yarn build:performance
yarn test:performance
```

--------------------------------

### LWC Playground Commands

Source: https://github.com/salesforce/lwc/blob/master/playground/README.md

Commands to run the LWC playground development server, build the app, and serve it.

```sh
$ npm run dev       # Get app server running
$ npm run build     # Build app in production mode
$ npx serve         # Serve the app (after running `npm run build`).
```

--------------------------------

### Build artifacts in `prod` mode

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Build artifacts in `prod` mode.

```shell
yarn build
```

--------------------------------

### Common Commands

Source: https://github.com/salesforce/lwc/blob/master/CLAUDE.md

Common commands for managing the LWC project using yarn.

```bash
# Install dependencies
yarn

# Run tests
yarn test

# Run tests for a specific package
yarn test packages/@lwc/ssr-compiler

# Build all packages
yarn build

# Lint
yarn lint

# Format code
yarn format

# Run bundlesize checks
yarn bundlesize
```

--------------------------------

### Equivalent import from '@lwc/engine-server'

Source: https://github.com/salesforce/lwc/blob/master/packages/lwc/README.md

Equivalent import directly from the scoped package.

```js
import { renderComponent } from '@lwc/engine-server';
```

--------------------------------

### version API

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/compiler/README.md

Get the current version of the compiler.

```js
import { version } from '@lwc/compiler';

console.log(version);
```

--------------------------------

### SignalBaseClass implementation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/signals/README.md

A base class providing a starting point for signal implementations.

```typescript
export abstract class SignalBaseClass<T> implements Signal<T> {
    abstract get value(): T;

    private subscribers: Set<OnUpdate> = new Set();

    subscribe(onUpdate: OnUpdate) {
        this.subscribers.add(onUpdate);
        return () => {
            this.subscribers.delete(onUpdate);
        };
    }

    protected notify() {
        for (const subscriber of this.subscribers) {
            subscriber();
        }
    }
}
```

--------------------------------

### Running Best Benchmarks Locally

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Command to run Best benchmark tests locally.

```shell
yarn test:performance:best
```

--------------------------------

### ExampleComponent with signals

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/signals/README.md

Demonstrates how to use signals in an LWC component.

```javascript
import { signal } from 'some/signals';

export default class ExampleComponent extends LightningElement {
    count = signal(0);

    increment() {
        this.count.value++;
    }
}
```

--------------------------------

### Enable a Feature

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/features/README.md

Example of enabling a feature by setting a boolean value for the flag in globalThis.lwcRuntimeFlags.

```javascript
lwcRuntimeFlags.ENABLE_SOME_FEATURE = true;
```

--------------------------------

### Set Sauce Labs username and key using a .env file

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Create a `.env` file in the root directory that sets the values for Sauce Labs username and key.

```dotenv
SAUCE_USERNAME=my-user
SAUCE_KEY=123-456-789
```

--------------------------------

### Build artifacts in `dev` mode

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Build artifacts in `dev` mode.

```shell
MODE=dev yarn build
```

--------------------------------

### Select a single browser for a run on Sauce Labs

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

To select a single browser for a run, pass `--browsers` followed by a comma separated list of browsers. The browser name must match the `commonName` in `wdio.sauce.conf.js`.

```shell
SAUCE_USERNAME=my_user SAUCE_KEY=123-456-789 yarn sauce:prod --browsers chrome
```

--------------------------------

### Reference a Runtime Flag

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/features/README.md

Example of how LWC internally references runtime flags to conditionally execute code.

```javascript
if (lwcRuntimeFlags.ENABLE_SOME_FEATURE) {
    // etc.
}
```

--------------------------------

### Notifying about property mutation

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/src/libs/mutation-tracker/README.md

Example of how to notify about a property mutation, typically used in event listeners or setters.

```javascript
elm.addEventListener('click', () => {
    // incrementing `o.x`
    o.x += 1;
    // record the mutation in case someone is tracking it
    valueMutated(o, 'x');
});
```

--------------------------------

### Forking and Cloning the LWC Repo

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Commands to clone your fork of the LWC repository and configure remote settings.

```bash
git clone git@github.com:<YOUR-USERNAME>/lwc.git
cd lwc
git remote add upstream git@github.com:salesforce/lwc.git
```

--------------------------------

### Testing Other Branches

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Environment variables to specify a different repository and branch/tag/commit for benchmarking.

```shell
BENCHMARK_REPO=https://example.com/repo.git \
  BENCHMARK_REF=branchOrTagOrCommit \
  yarn build:performance
```

--------------------------------

### Running Best Benchmarks in CI

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Command to run Best benchmark tests in a CI environment.

```shell
yarn test:performance:best:ci
```

--------------------------------

### Unit Testing LWC

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Runs Vitest unit tests.

```bash
yarn test
```

--------------------------------

### Recreate Summary Tables

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Commands to recreate summary tables from existing JSON files without re-running the full test suite.

```shell
cd packages/@lwc/perf-benchmarks
yarn test:format
```

--------------------------------

### Import Polyfill

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/aria-reflection/README.md

Import the @lwc/aria-reflection module to apply the polyfill globally.

```javascript
import '@lwc/aria-reflection';
```

--------------------------------

### Debug Vitest tests

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Command to start Vitest tests in debug mode, allowing use of Chrome's debugger.

```bash
yarn test:debug <path_to_test>
```

--------------------------------

### Component wired to getBook wire adapter

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/wire-service/README.md

Example of a Lightning Web Component using the @wire decorator to connect to the getBook wire adapter.

```javascript
// bookItem.js
import { LightningElement } from 'lwc';

export default class WireExample extends {
    @api bookId;

    @wire(getBook, { id: '$bookId'})
    book;
}
```

--------------------------------

### Run integration tests locally in headless Chrome

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Run integration tests locally in headless Chrome.

```shell
yarn local
```

--------------------------------

### Run test suites or individual files locally in headless Chrome

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Run test suites or individual files locally in headless Chrome.

```shell
yarn local --suite SUITE_NAME
```

```shell
yarn local --spec path/to/my/spec.js
```

--------------------------------

### Performance testing LWC

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Commands to build and run performance tests for LWC.

```shell
yarn build
yarn build:performance
yarn test:performance
```

--------------------------------

### Adjusting Benchmark Settings

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Environment variables to adjust default benchmark settings like sample size, auto-sample conditions, timeout, and CPU throttling rate.

```shell
BENCHMARK_SAMPLE_SIZE=50
BENCHMARK_AUTO_SAMPLE_CONDITIONS=25%
BENCHMARK_TIMEOUT=5
BENCHMARK_CPU_THROTTLING_RATE=4
```

--------------------------------

### Execute a particular test

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Runs a specific Vitest test file.

```bash
yarn test <path_to_test>
```

--------------------------------

### Set Sauce Labs username and key while running the test script

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Set Sauce Labs username and key while running the test script.

```shell
SAUCE_USERNAME=my-user SAUCE_KEY=123-456-789 yarn run test:integration:sauce
```

--------------------------------

### Run integration tests across all browsers on Sauce Labs

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Run integration tests across all browsers on Sauce Labs (see below for more details).

```shell
yarn sauce
```

--------------------------------

### Making and Committing Changes

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Commands for staging, committing, and pushing code changes, including the option to use 'git cz' for interactive semantic commits.

```bash
git add <path/to/file/to/commit>
git commit or git cz
git push origin <name-of-the-feature>
```

--------------------------------

### Creating a Feature Branch

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Commands to create a new branch for feature development.

```bash
git checkout master
git pull origin master
git checkout -b <name-of-the-feature>
```

--------------------------------

### Run an Individual Benchmark

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/perf-benchmarks/README.md

Command to run a specific benchmark using Tachometer.

```shell
cd packages/@lwc/perf-benchmarks
yarn tach --config dist/__benchmarks__/path/to/tachometer.json
```

--------------------------------

### Counter Component Structure

Source: https://github.com/salesforce/lwc/blob/master/packages/lwc/README.md

Directory structure for a simple counter component.

```ascii
counter
  ├──counter.css
  ├──counter.html
  └──counter.js
```

--------------------------------

### Bundle Size Monitoring

Source: https://github.com/salesforce/lwc/blob/master/CONTRIBUTING.md

Commands to check minified bundle sizes against defined thresholds.

```shell
yarn build
yarn bundlesize
```

--------------------------------

### Run integration tests on specific browsers on Sauce Labs

Source: https://github.com/salesforce/lwc/blob/master/packages/@lwc/integration-wdio/README.md

Run integration tests on specific browsers on Sauce Labs (see below for more details).

```shell
yarn sauce --browsers firefox
```