Salesforce Lightning Page debug 查看具体内容

本文介绍了如何在SalesforceLightning应用中使用ChromeDevTools的强大功能,包括检查代码执行、验证变量、测量执行时间、解决保存问题和模拟数据返回等,以提高开发和故障排查效率。

General Tools and settings:

  • use Chrome + built in Dev Tools + Lightning Component Inspector
  • be sure debug mode is enabled in your org (Setup: Lightning Components)
  • be sure caching is disabled in your org (Setup: Session Settings -> uncheck "Enable secure and persistent browser caching to improve performance"

Techniques for most common use cases (be sure that Dev Tools in Chrome are open while testing):

  • check certain JavaScript code is called at all:
    use console.log()console.debug()console.warn()console.error() (different color visualizations) -> can output a variable value as well

  • check for invalid values only:
    rather always log to the console you can do console.assert(myVar != 0) to only show an error when assertion fails

  • evaluate variables / context on a certain JavaScript code:
    use debugger; (this will create a breakpoint in code execution) -> now use the console from Dev Tools while breakpoint is active.
    You can write JavaScript to test value of variables, do function calls and check return types, overwrite JavaScript values, and so on. This is super powerful also developing your code

  • output the value of a more complex Object:
    while code execution is paused on a breakpoint (see above) use copy(JSON.stringify(myObjectToEvaluate)); in the Dev Tool console - this will copy the value as JSON to your clipboard and you can process/inspect text based value

  • measure code execution time between two dedicated "anchors": use console.time("identifier"); [code to execute] console.timeEnd("identifier");

  • check why code can not be saved or application is not loading at all: use the Salesforce Lightning CLI to lint your JavaScript code (very useful to check against faulty structure like missing braces)

  • investigate runtime exceptions origin:
    sometimes runtime exceptions show up you don't know exactly where they come from. Use "Pause on Exception"-Button under the "Sources"-Tab in Dev Tools - inside the panel "Call Stack" check if you can identify classes from your code.
    As code execution is paused you have the same behavior as a manual breakpoint: on every entry you are in the right JavaScript context so you can evaluate all values at that certain code execution time. Add some additional breakpoints (by clicking the line number in the Dev Tools) and you will always pause the code on certain area (like to check what values are before the exception raises or pause on code you can't write a debugger-statement by yourself)

  • mock data returned from you Apex controller: use the Lightning Components Inspector "Action" Tab and overwrite the result coming back from the server the next time

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值