Skip to content

Commit

Permalink
Merge pull request #1853 from OnesAndZer0s/main
Browse files Browse the repository at this point in the history
feat: Tidying Up of Instrumentation Breakpoints
  • Loading branch information
connor4312 authored Oct 23, 2023
2 parents dde2793 + 95d6a90 commit aa1cd44
Show file tree
Hide file tree
Showing 14 changed files with 1,790 additions and 271 deletions.
14 changes: 10 additions & 4 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,11 @@
"editor.insertSpaces": true,
"editor.tabSize": 2,
"editor.detectIndentation": false,
"eslint.validate": ["javascript", "javascriptreact", "typescript"],
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript"
],
"search.exclude": {
"**/testdata": true,
"**/.dynamic-testWorkspace/defaultSearchExcluded": true
Expand All @@ -17,9 +21,11 @@
"**/.hg": true,
"**/CVS": true,
"**/.DS_Store": true,
"**/Thumbs.db": true,
"**/obj": true,
"**/.dynamic-testWorkspace": true,
"**/.vscode-test": true,
"**/demos": true,
"**/demos": true
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
Expand All @@ -28,5 +34,5 @@
"source.organizeImports": true
},
"editor.formatOnSave": true,
"typescript.tsserver.experimental.enableProjectDiagnostics": true,
}
"typescript.tsserver.experimental.enableProjectDiagnostics": true
}
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ By default, any links you click through the JavaScript debug terminal (`Debug: C

### Instrumentation breakpoints

When debugging web apps, you can configure instrumentation breakpoints from VS Code in the "Browser Breakpoints" view.
When debugging web apps, you can configure instrumentation breakpoints from VS Code in the "Event Listener Breakpoints" view.

<img src="resources/readme/instrumentation-breakpoints.png" width="367">
<img src="resources/readme/instrumentation-breakpoints2.png" width="602">
Expand Down
6 changes: 3 additions & 3 deletions package.nls.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"add.browser.breakpoint": "Add Browser Breakpoint",
"add.eventListener.breakpoint": "Add Event Listener Breakpoint",
"attach.node.process": "Attach to Node Process",
"base.cascadeTerminateToConfigurations.label": "A list of debug sessions which, when this debug session is terminated, will also be stopped.",
"base.enableDWARF.label": "Toggles whether the debugger will try to read DWARF debug symbols from WebAssembly, which can be resource intensive. Requires the `ms-vscode.wasm-dwarf-debugging` extension to function.",
Expand Down Expand Up @@ -185,8 +185,8 @@
"pretty.print.script": "Pretty print for debugging",
"profile.start": "Take Performance Profile",
"profile.stop": "Stop Performance Profile",
"remove.browser.breakpoint.all": "Remove All Browser Breakpoints",
"remove.browser.breakpoint": "Remove Browser Breakpoint",
"remove.eventListener.breakpoint.all": "Remove All Event Listener Breakpoints",
"remove.eventListener.breakpoint": "Remove Event Listener Breakpoint",
"requestCDPProxy.label": "Request CDP Proxy for Debug Session",
"skipFiles.description": "An array of glob patterns for files to skip when debugging. The pattern `<node_internals>/**` matches all internal Node.js modules.",
"smartStep.description": "Automatically step through generated code that cannot be mapped back to the original source.",
Expand Down
5 changes: 5 additions & 0 deletions src/adapter/breakpoints/conditions/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,11 @@ export interface IBreakpointCondition {
*/
export const AlwaysBreak = new SimpleCondition({ line: 0 }, undefined);

/**
* Condition that indicates we should never break at the give spot.
*/
export const NeverBreak = new SimpleCondition({ line: 0 }, 'false');

/**
* Creates breakpoint conditions for source breakpoints.
*/
Expand Down
135 changes: 76 additions & 59 deletions src/adapter/customBreakpoints.ts
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,12 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
};
}

g(`Ad Auction Worklet`, [
i('beforeBidderWorkletBiddingStart', l10n.t('Bidder Bidding Phase Start')),
i('beforeBidderWorkletReportingStart', l10n.t('Bidder Reporting Phase Start')),
i('beforeSellerWorkletScoringStart', l10n.t('Seller Scoring Phase Start')),
i('beforeSellerWorkletReportingStart', l10n.t('Seller Reporting Phase Start')),
]);
g(`Animation`, [
i('requestAnimationFrame', l10n.t('Request Animation Frame')),
i('cancelAnimationFrame', l10n.t('Cancel Animation Frame')),
Expand All @@ -125,64 +131,6 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
i('webglErrorFired', l10n.t('WebGL Error Fired')),
i('webglWarningFired', l10n.t('WebGL Warning Fired')),
]);
g(`Script`, [
i('scriptFirstStatement', l10n.t('Script First Statement')),
i('scriptBlockedByCSP', l10n.t('Script Blocked by Content Security Policy')),
]);
g(`Geolocation`, [
i('Geolocation.getCurrentPosition', `getCurrentPosition`),
i('Geolocation.watchPosition', `watchPosition`),
]);
g(`Notification`, [i('Notification.requestPermission', `requestPermission`)]);
g(`Parse`, [
i('Element.setInnerHTML', l10n.t('Set innerHTML')),
i('Document.write', `document.write`),
]);
g(`Timer`, [
i('setTimeout'),
i('clearTimeout'),
i('setInterval'),
i('clearInterval'),
i('setTimeout.callback', l10n.t('setTimeout fired')),
i('setInterval.callback', l10n.t('setInterval fired')),
]);
g(`Window`, [i('DOMWindow.close', `window.close`)]);
g(`WebAudio`, [
i('audioContextCreated', l10n.t('Create AudioContext')),
i('audioContextClosed', l10n.t('Close AudioContext')),
i('audioContextResumed', l10n.t('Resume AudioContext')),
i('audioContextSuspended', l10n.t('Suspend AudioContext')),
]);
const av = ['audio', 'video'];
g(`Media`, [
e('play', av),
e('pause', av),
e('playing', av),
e('canplay', av),
e('canplaythrough', av),
e('seeking', av),
e('seeked', av),
e('timeupdate', av),
e('ended', av),
e('ratechange', av),
e('durationchange', av),
e('volumechange', av),
e('loadstart', av),
e('progress', av),
e('suspend', av),
e('abort', av),
e('error', av),
e('emptied', av),
e('stalled', av),
e('loadedmetadata', av),
e('loadeddata', av),
e('waiting', av),
]);
g(`Picture-in-Picture`, [
e('enterpictureinpicture', 'video'),
e('leavepictureinpicture', 'video'),
e('resize', 'PictureInPictureWindow'),
]);
g(`Clipboard`, [
e('copy'),
e('cut'),
Expand All @@ -194,6 +142,7 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
g(`Control`, [
e('resize'),
e('scroll'),
e('scrollend'),
e('zoom'),
e('focus'),
e('blur'),
Expand All @@ -216,7 +165,7 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
e('DOMSubtreeModified'),
e('DOMContentLoaded'),
]);
g(`Drag / drop`, [
g(`Drag / Drop`, [
e('drag'),
e('dragstart'),
e('dragend'),
Expand All @@ -225,6 +174,10 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
e('dragleave'),
e('drop'),
]);
g(`Geolocation`, [
i('Geolocation.getCurrentPosition', `getCurrentPosition`),
i('Geolocation.watchPosition', `watchPosition`),
]);
g(`Keyboard`, [e('keydown'), e('keyup'), e('keypress'), e('input')]);
g(`Load`, [
e('load'),
Expand All @@ -234,6 +187,39 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
e('error'),
e('hashchange'),
e('popstate'),
e('navigate'),
e('navigatesuccess'),
e('navigateerror'),
e('currentchange'),
e('nagivateto'),
e('navigatefrom'),
e('finish'),
e('dispose'),
]);
const av = ['audio', 'video'];
g(`Media`, [
e('play', av),
e('pause', av),
e('playing', av),
e('canplay', av),
e('canplaythrough', av),
e('seeking', av),
e('seeked', av),
e('timeupdate', av),
e('ended', av),
e('ratechange', av),
e('durationchange', av),
e('volumechange', av),
e('loadstart', av),
e('progress', av),
e('suspend', av),
e('abort', av),
e('error', av),
e('emptied', av),
e('stalled', av),
e('loadedmetadata', av),
e('loadeddata', av),
e('waiting', av),
]);
g(`Mouse`, [
e('auxclick'),
Expand All @@ -250,6 +236,17 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
e('wheel'),
e('contextmenu'),
]);
g(`Notification`, [i('Notification.requestPermission', `requestPermission`)]);
g(`Parse`, [
i('Element.setInnerHTML', l10n.t('Set innerHTML')),
i('Document.write', `document.write`),
]);
g(`Picture-in-Picture`, [
e('enterpictureinpicture', 'video'),
e('leavepictureinpicture', 'video'),
e('resize', 'PictureInPictureWindow'),
e('enter', 'documentPictureInPicture'),
]);
g(`Pointer`, [
e('pointerover'),
e('pointerout'),
Expand All @@ -261,8 +258,28 @@ export function customBreakpoints(): Map<string, ICustomBreakpoint> {
e('pointercancel'),
e('gotpointercapture'),
e('lostpointercapture'),
e('pointerrawupdate'),
]);
g(`Script`, [
i('scriptFirstStatement', l10n.t('Script First Statement')),
i('scriptBlockedByCSP', l10n.t('Script Blocked by Content Security Policy')),
]);
g(`Timer`, [
i('setTimeout'),
i('clearTimeout'),
i('setInterval'),
i('clearInterval'),
i('setTimeout.callback', l10n.t('setTimeout fired')),
i('setInterval.callback', l10n.t('setInterval fired')),
]);
g(`Touch`, [e('touchstart'), e('touchmove'), e('touchend'), e('touchcancel')]);
g(`WebAudio`, [
i('audioContextCreated', l10n.t('Create AudioContext')),
i('audioContextClosed', l10n.t('Close AudioContext')),
i('audioContextResumed', l10n.t('Resume AudioContext')),
i('audioContextSuspended', l10n.t('Suspend AudioContext')),
]);
g(`Window`, [i('DOMWindow.close', `window.close`)]);
g(`Worker`, [e('message'), e('messageerror')]);
const xhr = ['xmlhttprequest', 'xmlhttprequestupload'];
g(`XHR`, [
Expand Down
32 changes: 10 additions & 22 deletions src/build/generate-contributions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1214,17 +1214,17 @@ const commands: ReadonlyArray<{
},
{
command: Commands.AddCustomBreakpoints,
title: refString('add.browser.breakpoint'),
title: refString('add.eventListener.breakpoint'),
icon: '$(add)',
},
{
command: Commands.RemoveCustomBreakpoint,
title: refString('remove.browser.breakpoint'),
command: Commands.RemoveCustomBreakpoints,
title: refString('remove.eventListener.breakpoint'),
icon: '$(remove)',
},
{
command: Commands.RemoveAllCustomBreakpoints,
title: refString('remove.browser.breakpoint.all'),
title: refString('remove.eventListener.breakpoint.all'),
icon: '$(close-all)',
},
{
Expand Down Expand Up @@ -1438,11 +1438,13 @@ const menus: Menus = {
'view/title': [
{
command: Commands.AddCustomBreakpoints,
when: `view == ${CustomViews.BrowserBreakpoints}`,
when: `view == ${CustomViews.EventListenerBreakpoints}`,
group: 'navigation',
},
{
command: Commands.RemoveAllCustomBreakpoints,
when: `view == ${CustomViews.BrowserBreakpoints}`,
when: `view == ${CustomViews.EventListenerBreakpoints}`,
group: 'navigation',
},
{
command: Commands.CallersRemoveAll,
Expand All @@ -1467,20 +1469,6 @@ const menus: Menus = {
},
],
'view/item/context': [
{
command: Commands.RemoveCustomBreakpoint,
when: `view == ${CustomViews.BrowserBreakpoints}`,
group: 'inline',
},
{
command: Commands.AddCustomBreakpoints,
when: `view == ${CustomViews.BrowserBreakpoints}`,
},
{
command: Commands.RemoveCustomBreakpoint,
when: `view == ${CustomViews.BrowserBreakpoints}`,
},

{
command: Commands.CallersGoToCaller,
group: 'inline',
Expand Down Expand Up @@ -1540,8 +1528,8 @@ const viewsWelcome = [
const views = {
debug: [
{
id: CustomViews.BrowserBreakpoints,
name: 'Browser breakpoints',
id: CustomViews.EventListenerBreakpoints,
name: 'Event Listener Breakpoints',
when: forBrowserDebugType('debugType'),
},
{
Expand Down
Loading

0 comments on commit aa1cd44

Please sign in to comment.