Skip to content

Commit a464ce6

Browse files
authored
Update debug-modern-pages.md
1 parent 62e474c commit a464ce6

File tree

1 file changed

+11
-11
lines changed

1 file changed

+11
-11
lines changed

docs/spfx/debug-modern-pages.md

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ To debug an Application Customizer, add the following to the URL of your modern
9696
> Line breaks & indentation have been added to the following snippet for readability. The following text should be on a single line with no whitespace.
9797
9898
```json
99-
`?loadSPFX=true
99+
?loadSPFX=true
100100
&debugManifestsFile=https://localhost:4321/temp/manifests.js
101101
&customActions={"<extensionId>":{
102102
"___location":"<extensionType>",
@@ -131,9 +131,9 @@ The `customActions` parameter has the following tokens that should be replaced:
131131

132132
| Token | Description |
133133
|--------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
134-
| `<extensionId>` | Use the GUID of the extension as the key to associate with the custom action. This has to match the ID value of your extension, which is available in the extension manifest.json file. |
134+
| `<extensionId>` | Use the GUID of the extension as the key to associate with the custom action. This has to match the ID value of your extension, which is available in the extension `manifest.json` file. |
135135
| `<extensionType>` | The type of custom action. Use `ClientSideExtension.ApplicationCustomizer` for the Application Customizer extension. |
136-
| `<propertiesJSON>` | An optional JSON object that contains properties that are available via the this.properties member |
136+
| `<propertiesJSON>` | An optional JSON object that contains properties that are available via the `this.properties` member. |
137137

138138
With the parameters added to the URL, reload the page in the web browser. The page will show a popup asking you to confirm that you now will be loading debug scripts.
139139

@@ -180,7 +180,7 @@ Following are the query string parameters that you need to add:
180180
|---------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
181181
|`loadSPFX=true` |Ensures that the SharePoint Framework is loaded on the page. For performance reasons, the framework doesn't load unless at least one extension is registered. Because no components are registered, you must explicitly load the framework. |
182182
|`debugManifestsFile` |Specifies that you want to load components that are locally served. The loader only looks for components in the app catalog (for your deployed solution) and the SharePoint manifest server (for the system libraries). |
183-
|`fieldCustomizers` |indicates which fields in your list should have their rendering controlled by the Field Customizer. The ID parameter specifies the GUID of the extension that should be used to control the rendering of the field. The properties parameter is an optional text string containing a JSON object that is deserialized into `this.properties` for your extension.|
183+
|`fieldCustomizers` |Indicates which fields in your list should have their rendering controlled by the Field Customizer. The ID parameter specifies the GUID of the extension that should be used to control the rendering of the field. The properties parameter is an optional text string containing a JSON object that is deserialized into `this.properties` for your extension.|
184184

185185
The `fieldCustomizers` parameter has the following tokens that should be replaced:
186186

@@ -204,7 +204,7 @@ To debug a list view command set, add the following to the URL of your modern pa
204204
> Line breaks & indentation have been added to the following snippet for readability. The following text should be on a single line with no whitespace.
205205
206206
```json
207-
?loadSpfx=true
207+
?loadSPFX=true
208208
&debugManifestsFile=https://localhost:4321/temp/manifests.js
209209
&customActions={"<extensionId>":{
210210
"___location":"<extensionType>",
@@ -216,7 +216,7 @@ For example:
216216

217217
```text
218218
https://contoso.sharepoint.com/sites/team-a/Lists/Orders/AllItems.aspx
219-
?loadSpfx=true
219+
?loadSPFX=true
220220
&debugManifestsFile=https://localhost:4321/temp/manifests.js
221221
&customActions={"a8047e2f-30d5-40fc-b880-b2890c7c16d6":{
222222
"___location":"ClientSideExtension.ListViewCommandSet.CommandBar",
@@ -233,15 +233,15 @@ Following are the query string parameters that you need to add:
233233
| -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
234234
| `loadSPFX=true` | Ensures that the SharePoint Framework is loaded on the page. For performance reasons, the framework doesn't load unless at least one extension is registered. Because no components are registered, you must explicitly load the framework. |
235235
| `debugManifestsFile` | Specifies that you want to load components that are locally served. The loader only looks for components in the app catalog (for your deployed solution) and the SharePoint manifest server (for the system libraries). |
236-
| `customActions` | simulates a custom action. You can set many properties on this CustomAction object that affect the look, feel, and ___location of your button; well cover them all later. |
236+
| `customActions` | Simulates a custom action. You can set many properties on this CustomAction object that affect the look, feel, and ___location of your button; we'll cover them all later. |
237237

238238
The `customActions` parameter has the following tokens that should be replaced:
239239

240240
| Token | Description |
241241
|--------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
242242
| `<extensionId>` | GUID of the extension. |
243243
| `<extensionType>` | Where the commands are displayed. The possible values are:<br/> `ClientSideExtension.ListViewCommandSet.ContextMenu`: The context menu of the item(s),<br/> `ClientSideExtension.ListViewCommandSet.CommandBar`: The top command set menu in a list or library.<br/> `ClientSideExtension.ListViewCommandSet`: Both the context menu and the command bar (corresponds to `SPUserCustomAction.Location="CommandUI.Ribbon"`). |
244-
| `<propertiesJSON>` | An optional JSON object containing properties that are available via the this.properties member. |
244+
| `<propertiesJSON>` | An optional JSON object containing properties that are available via the `this.properties` member. |
245245

246246
With the parameters added to the URL, reload the page in the web browser. The page will show a popup asking you to confirm that you now will be loading debug scripts.
247247

@@ -298,7 +298,7 @@ Using the SharePoint workbench, you can only test web parts from your solution.
298298

299299
## Debug SharePoint Framework web parts - an alternative approach
300300

301-
If you build your web part solution without the **--ship** argument as following
301+
If you build your web part solution without the **--ship** argument as following:
302302

303303
```console
304304
gulp bundle
@@ -307,13 +307,13 @@ gulp package-solution
307307

308308
the packages generated will reference the code from your local computer (https://localhost:4321). You can deploy the solution to the app catalog as you normally would.
309309

310-
You can then start your local server by running
310+
You can then start your local server by running:
311311

312312
```console
313313
gulp serve --nobrowser
314314
```
315315

316-
Now you can go back to a SharePoint site where the solution has been deployed and add the web parts to any page, modern or classic, and the web part code will be loaded from your local development environment. You can debug your web parts just as you would if you ran 'gulp serve' and added your web part to the workbench.
316+
Now you can go back to a SharePoint site where the solution has been deployed and add the web parts to any page, modern or classic, and the web part code will be loaded from your local development environment. You can debug your web parts just as you would if you ran `gulp serve` and added your web part to the workbench.
317317

318318
This approach should only be used when you're in development mode. If you deploy an app to the app catalog that points to your local host, it will fail to run if your development environment isn't running.
319319

0 commit comments

Comments
 (0)