zoukankan      html  css  js  c++  java
  • 使用Fiddle修改在线加载的前端框架js文件,用于各种调试目的

    Sometimes for trouble shooting or research purpose, you would like to make small changes on framework js file, and test how your application would react to those changes.
    For example I would like to add a new line for debugging purpose before line 70.

    It is not possible to make any modifications on the formatted js file done by Chrome “Pretty print” button.

    We can only change original unformatted file or switch the source code to debugger version and change Text-dbg.js instead. Unfortunately changes done by both approaches could not be persisted. Once we refresh Chrome, they are gone.

    Inspired by Alessandro Spadoni‘s great blog Switch #openui5 version on-the-fly without changing the code – Web Debugging Proxy, now I can use Fiddle to achieve the requirement once and for all:

    (1) Download the original Text.js to local laptop. Add the code you would like to insert and save the change.

    (2) Open Fiddle, run UI5 application and use Fiddle to capture the network traffic. Find the corresponding session to request Text.js, and drag it to tab “AutoResponder” and drop there. Select the two checkbox “Enable rules” and “Unmatched requests passthrough”.

    Once you finished drop, the Text.js url will be automatically populated to Rule Editor.

    Select “Find a file” from drop down list and specify the local modified file you have done in previous step.

    Once done, you have now created one rule as below: every time the Text.js with given url is accessed, Fiddle will serve it with your local modified version as response.

    Now we can re-launch application and have a test. We can observe that this time, the modified Text.js is returned:

    And in Chrome development tool, we can also see modified source code of Text.js.

    要获取更多Jerry的原创文章,请关注公众号"汪子熙":

  • 相关阅读:
    Delphi / C++ Builder 使用 UDT ( UDP-based Data Transfer ) 4.11
    STUN: NAT 类型检测方法
    udt nat traverse
    UDT: Breaking the Data Transfer Bottleneck
    Freescale OSBDM JM60仿真器
    How To: Perl TCP / UDP Socket Programming using IO::Socket::INET
    NAT类型与穿透 及 STUN TURN 协议
    根据PID和VID得到USB转串口的串口号
    pic/at89c2051 programmer
    IC开短路测试(open_short_test),编程器测试接触不良、开短路
  • 原文地址:https://www.cnblogs.com/sap-jerry/p/13639740.html
Copyright © 2011-2022 走看看