From a801c4cb09ec25b31697e95345ef79709231e1ec Mon Sep 17 00:00:00 2001 From: xiaoyifang <105986+xiaoyifang@users.noreply.github.com> Date: Wed, 30 Aug 2023 16:19:24 +0800 Subject: [PATCH] Update how to debug dictionary js.md --- website/docs/howto/how to debug dictionary js.md | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/website/docs/howto/how to debug dictionary js.md b/website/docs/howto/how to debug dictionary js.md index c5fc314c..52ed4a68 100644 --- a/website/docs/howto/how to debug dictionary js.md +++ b/website/docs/howto/how to debug dictionary js.md @@ -1,27 +1,29 @@ -# background +# How to debug dictionary javascript + +## background When some js functions do not work as expected, this article tries to give a debug solution to pinpoint the problem. -# goldendict-ng inspector +## goldendict-ng inspector Goldendict-ng has embedded an inspector, you can trigger it manually using `F12`. Screenshot: ![Inspector](../img/inspector.png) -# How to navigate to the specified element +## How to navigate to the specified element Click the find element and move mouse to the specified element, click the element will navigate the source panel to the very place. ![steps](../img/inspector-steps.png) -# Modify the css style +## Modify the css style you can play around with the css to modify the appearance of the html and check the results. ![style](../img/inspector-style.png) -# check javascript events +## check javascript events - navigate to the specified element - check eventlisterner panel @@ -36,7 +38,7 @@ If some desired event does not triggered , it can first check does the event lis ![breakpoint](../img/inspector-breakpoint.png) -# reproduce the issue in the goldendit +## reproduce the issue in the goldendit following your normal operations and debugging the javascript code and pay attention to the console output. Whether any errors happened. -![Alt text](../img/inspector-console.png) \ No newline at end of file +![Alt text](../img/inspector-console.png)