Google Chrome 插件开发—调试篇

Stella981
• 阅读 1555

起因

最近,整合了 Chrome 的两个小插件,由于小工具,缺乏维护,里面很多bug,只能自己一点点来解决了。 下面说说在处理问题时候的插件Debugger。

内容

首先需要做的是,在 Chrome 的扩展程序中打开:开发者模式->选择:加载正在开发的扩展程序 将我们的插件加载进来。 可以看到类似内容:

fastForm 0.1
record value of form. recorded value automatically entered. 权限
ID: ciobjfcbnhglnmfabchoicnopabhagea
加载来源: F:\1.1_0\fastForm
检查视图: background.html

这里我们可以直接点击 background.html 文件,在这里可以进行对 background.js 文件的调试。 在加载插件完成后,我们可以在导航栏上看到我们的插件了.

第二个调试的地方出现,对着我们的插,右键选择 ->审查元素。会打开针对popup.html的开发者工具。就可以调试当前:popup.html页面里面加载的js文件。

<code>第三 我们会在manifest里写上一个
</code>

"content_scripts": [ {
"js": [ "jquery.1.7.js", "content.js" ],
"matches": [ "http:///", "https:///" ]
} ],

这样的配置。content_scripts里的文件,我们需要在打开的的网页中按下F12。这时候会打开开发者工具,注意,这个开发者工具是针对当前页面的。依次选择:

source->content_scripts(左边小框点进去第二个)

这个时候就按我们上面记录的Id:ciobjfcbnhglnmfabchoicnopabhagea就能够看到我们的"jquery.1.7.js", "content.js"这两个文件了。可以直接打断点进行调试。
第四,还有一种加载的js文件。配置文件manifest写入

"permissions": [ "tabs", "http:///", "https:///" ],

之后我们可以在代码处理中直接调用

chrome.tabs.executeScript(null, {file: '/fill/fill_form.js'});

来运行我们的fill_form.js文件。我没找到一个直接能看到文件的调试方法。选择了一个迂回方式。直接需要断点的前面,加上关键字:debugger;将会自动停在这。

结束

感觉这样下来,调试还是比较麻烦的,希望能找到更好的办法解决这个问题

点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
待兔 待兔
5个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
Jacquelyn38 Jacquelyn38
3年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Stella981 Stella981
3年前
HackBar破解(谷歌、火狐)
1.谷歌打开Chrome插件列表,查看Hackbar的插件ID:djmoeo……,在文件搜索里搜这段字符,我这里用的是Everything。!(https://img2018.cnblogs.com/blog/1392192/201907/139219220190701125726213948998123.png)Everyth
Easter79 Easter79
3年前
Twitter的分布式自增ID算法snowflake (Java版)
概述分布式系统中,有一些需要使用全局唯一ID的场景,这种时候为了防止ID冲突可以使用36位的UUID,但是UUID有一些缺点,首先他相对比较长,另外UUID一般是无序的。有些时候我们希望能使用一种简单一些的ID,并且希望ID能够按照时间有序生成。而twitter的snowflake解决了这种需求,最初Twitter把存储系统从MySQL迁移
Wesley13 Wesley13
3年前
vivo Y71的USB调试模式在哪里,开启vivo Y71USB调试模式的流程
就在我们使用安卓手机通过数据线连接到电脑的时候,如果手机没有开启usb开发者调试模式,电脑则没能成功识别我们的手机,部分工具也没能正常使用,此情况我们需要找解决方法将手机的usb开发者调试模式打开,以下内容我们讲解vivoY71如何开启usb开发者调试模式的方法。首先,在vivoY71应用程序界面点中“设置”ICON,进入vivoY71系统“设置”
Stella981 Stella981
3年前
Django中Admin中的一些参数配置
设置在列表中显示的字段,id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
Stella981 Stella981
3年前
Eclipse插件开发_学习_00_资源帖
一、官方资料 1.eclipseapi(https://www.oschina.net/action/GoToLink?urlhttp%3A%2F%2Fhelp.eclipse.org%2Fmars%2Findex.jsp%3Ftopic%3D%252Forg.eclipse.platform.doc.isv%252Fguide%2
Python进阶者 Python进阶者
11个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这