Add docs about debugging (#37)
* Add CODEOWNERS * Add doc for debug * Update readme * Update readme * Update docs/debugging.md Co-authored-by: Adrian Pilarczyk <adrianpilarczyk314@gmail.com> * Update docs/debugging.md Co-authored-by: Adrian Pilarczyk <adrianpilarczyk314@gmail.com> * Update docs/debugging.md Co-authored-by: Adrian Pilarczyk <adrianpilarczyk314@gmail.com> * Apply suggestions from code review Co-authored-by: Adrian Pilarczyk <adrianpilarczyk314@gmail.com> * Add info about debug in iframe Co-authored-by: Adrian Pilarczyk <adrianpilarczyk314@gmail.com>
This commit is contained in:
parent
9b541cf318
commit
191f12a87d
4 changed files with 55 additions and 0 deletions
1
CODEOWNERS
Normal file
1
CODEOWNERS
Normal file
|
@ -0,0 +1 @@
|
|||
* @saleor/devtools
|
|
@ -24,6 +24,8 @@ npm i @saleor/app-sdk
|
|||
## Docs
|
||||
|
||||
- [AppBridge](./docs/app-bridge.md) - communication layer between Saleor App and Dashboard
|
||||
- [APL](./docs/apl.md) - an interface that enabled App communicating between one or more Saleor instances
|
||||
- [Debugging](./docs/debugging.md) - how to debug app-sdk behaviour
|
||||
|
||||
## Development
|
||||
|
||||
|
|
1
docs/CODEOWNERS
Normal file
1
docs/CODEOWNERS
Normal file
|
@ -0,0 +1 @@
|
|||
* @saleor/docs
|
51
docs/debugging.md
Normal file
51
docs/debugging.md
Normal file
|
@ -0,0 +1,51 @@
|
|||
# Debugging
|
||||
|
||||
The ability to debug is important for app developers.
|
||||
App SDK provides opt-in verbose logs, that can be enabled for specific modules.
|
||||
|
||||
Debug logs are implemented with [debug](https://www.npmjs.com/package/debug) package and work both in Node and Browser.
|
||||
|
||||
## Enabling verbose logs
|
||||
|
||||
Debug logs are aggregated within [namespaces](#namespaces). They can be enabled, disabled, or configured.
|
||||
|
||||
By default, all verbose logs are disabled.
|
||||
|
||||
To enable logs, use the following:
|
||||
|
||||
### Enabling in Node context
|
||||
|
||||
Add `DEBUG={namespaces}` env variable.
|
||||
|
||||
#### Example
|
||||
|
||||
```shell
|
||||
DEBUG=* pnpm run dev
|
||||
```
|
||||
|
||||
For more details check [debug package](https://github.com/debug-js/debug#usage).
|
||||
|
||||
### Enabling in Browser context
|
||||
|
||||
Set `localStorage.debug = '{namepsaces}'` in your frontend code. For more details see [debug package](https://github.com/debug-js/debug#browser-support).
|
||||
|
||||
#### Debug in iframe
|
||||
|
||||
Note, that Saleor Apps are usually hosted on a different domain than Saleor Dashboard.
|
||||
That means `localStorage` must be called in the context of the App's URL, not Saleor Dashboard.
|
||||
|
||||
#### Example
|
||||
|
||||
```javascript
|
||||
// In devtools console
|
||||
localStorage.debug = "*";
|
||||
```
|
||||
|
||||
## Namespaces
|
||||
|
||||
Use the namespace name to enable debug logs for each module.
|
||||
|
||||
| Namespace name | Description |
|
||||
| -------------- | -------------------------------------------------- |
|
||||
| \* | Enable all |
|
||||
| AppBridge | Enable [AppBridge](./app-bridge.md) (browser only) |
|
Loading…
Reference in a new issue