禪道項(xiàng)目管理軟件bug過(guò)濾腳本

沈儉發(fā)布于2019-08-21 14:47 / 1756人閱讀

摘要：新公司使用禪道作管理系統(tǒng)。每次產(chǎn)品上線的時(shí)候，所有的測(cè)試人員測(cè)試出之就就提在禪道上。避免本頁(yè)跳轉(zhuǎn)導(dǎo)致腳本失效。并給它綁定事件。很多瀏覽器插件，其實(shí)也是在別人的網(wǎng)站上運(yùn)行自己的腳本實(shí)現(xiàn)一些操作。

新公司使用禪道作bug管理系統(tǒng)。每次產(chǎn)品上線的時(shí)候，所有的測(cè)試人員測(cè)試出bug之就就提在禪道上。
由于我們公司目前的測(cè)試只有一個(gè)，就把很多產(chǎn)品拉來(lái)湊數(shù)。他們分不清bug和需求。所以往往出現(xiàn)的情況是一大屏的bug。但實(shí)際上能改的沒(méi)幾個(gè)。并且有很多bug是后端的。
要從那么多bug中找出來(lái)自己能改的，每次都要從那么多bug中來(lái)看，往往看得眼都花了，也沒(méi)找出來(lái)幾個(gè)有效bug，偏偏又不能處理掉，因?yàn)槠渌丝赡芤础?/p>

于是決定花點(diǎn)時(shí)間寫(xiě)個(gè)腳本來(lái)幫我處理一下那些干擾信息。把那些我不需要看到的條目隱藏起來(lái)。
要在bug列表table每一行加一個(gè)隱藏按鈕。點(diǎn)擊的話(huà)會(huì)隱藏掉該行。并且把該行的checkbox的value值記錄到localStorage中。

在console控制臺(tái)運(yùn)行腳本，會(huì)做這幾件事：
1.給table所有的a標(biāo)簽加屬性target="_blank"，這樣就會(huì)到新頁(yè)面打開(kāi)bug詳情。避免本頁(yè)跳轉(zhuǎn)導(dǎo)致腳本失效。
2.把所有tr行中的checkbox的值放到該tr上。data-id屬性中。方便后續(xù)操作。
3.每行加一個(gè)隱藏按鈕。并給它綁定事件。點(diǎn)擊按鈕隱藏此行。把最后一個(gè)td加長(zhǎng)。
4.把localStorage保存的所有值的行隱藏起來(lái)。

為了避免翻頁(yè)引起頁(yè)面跳轉(zhuǎn)。先要把每一頁(yè)的數(shù)量調(diào)大一些。這樣操作就在同一個(gè)頁(yè)面上，不需要多次運(yùn)行腳本了。
原來(lái)的bug可能有這么多：

運(yùn)行腳本之后的效果（很多條干擾信息已經(jīng)被我隱藏掉了）：

可以看到每一行的右邊都加了一個(gè)隱藏按鈕。我們看過(guò)bug之后覺(jué)得是自己不用理會(huì)的。就可以點(diǎn)擊隱藏。
并且下次打開(kāi)頁(yè)面再次運(yùn)行腳本，你之前隱藏過(guò)的就會(huì)自動(dòng)隱藏起來(lái)。
這樣就能很大程度上減少干擾信息了。

另外，這個(gè)代碼通用性也是比較強(qiáng)的。換一個(gè)系統(tǒng)，要實(shí)現(xiàn)類(lèi)似的功能只需要稍作改動(dòng)就可以。

下面是代碼：

function CD(){}

CD.prototype = {
    init:function(){
        this.open();
        this.hideItems();
        this.bindEvent();
    },
    open:function(){
        //所有a標(biāo)簽新標(biāo)簽打開(kāi)
        $("td a").attr("target","_blank");
        //給每一行加一個(gè)我們的按鈕。
        $(".s-hide").remove();
        $("tr.text-center td:last-child").append("隱藏");
        $("tr th:last").width(170);
        //給tr加上id。方便操作
        $("tr").each(function(index, el) {
            $(this).attr("data-id",$(this).find("input:checkbox").val());
        });
    },
    bindEvent:function(){        
        //點(diǎn)擊隱藏。
        $("body").on("click", ".s-hide", function(event) {
            
            var id = $(this).parents("tr").find("input:checkbox").val();
            var hideStr = localStorage.hideStr || "";
            var hideArr = hideStr.split("-");
            hideArr.push(id);
            localStorage.hideStr = hideArr.join("-");
            $(this).parents("tr").hide();
        });
    },
    //初始化的時(shí)候隱藏我們隱藏過(guò)的。
    hideItems:function(){
        var hideStr = localStorage.hideStr || "";
        var hideArr = hideStr.split("-");
        var len = hideArr.length;
        for (var i = 0; i < len; i++) {
            $("tr[data-id="+hideArr[i]+"]").hide();
        }
    },
    //顯示隱藏的。
    show:function(){
        localStorage.hideStr = "";
        $("tr").show();
    }
}
//調(diào)用
var cd = new CD;
cd.init();

// 顯示全部請(qǐng)手動(dòng)調(diào)用　　cd.show();

嗯，JavaScript能做的事實(shí)在太多。
面對(duì)別人的網(wǎng)站，我們也可以大有可為。
很多瀏覽器插件，其實(shí)也是在別人的網(wǎng)站上運(yùn)行自己的腳本實(shí)現(xiàn) 一些操作。比如攔截廣告。搶月餅。。。
作為一個(gè)前端程序員來(lái)講，順手寫(xiě)幾行腳本提高一點(diǎn)工作效率也是不錯(cuò)的。

github:https://github.com/liusaint/J...
注：本文同步發(fā)表在我的CSDN博客上。