> ## Documentation Index
> Fetch the complete documentation index at: https://docs.beyondwords.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Troubleshooting

> Common issues when building a player with the custom elements, and how to fix them.

## "\<bw-player-provider> parent not found"

An element that extends `BwPlayerConsumer` was used outside a
[`<bw-player-provider>`](/player-ui/html/player-provider). Make sure the
provider wraps every control.

## "BeyondWords is not defined" or the player never loads

The elements expect the player to be available as the global `BeyondWords`. Load
the player UMD script before the provider connects:

```html theme={null}
<script async src="https://proxy.beyondwords.io/npm/@beyondwords/player@latest/dist/umd.js"></script>
```

## The BeyondWords player UI shows up as well as mine

The engine renders its own UI by default. Set `data-show-user-interface="false"`
on the provider so only your UI shows:

```html theme={null}
<bw-player-provider data-project-id="9504" data-source-id="…" data-show-user-interface="false"></bw-player-provider>
```

## My elements render as empty tags

A custom element only upgrades once its module has run `customElements.define`.
Make sure you've imported each element's module:

```html theme={null}
<script type="module">
  import "@/registry/html/PlayerProvider";
  import "@/registry/html/PlayPauseButton";
</script>
```

## My styles aren't being applied

The elements are minimal by design. They render into the light DOM, so your
page's CSS can target them directly. See [Theming](/player-ui/html/theming).

## Nothing plays

* Check the `data-project-id` and `data-source-id` (or content ID) are valid for
  your project.
* Browsers block audio until the user interacts with the page, so the first
  playback must come from a user action like a click.
