From 25bdf2f9d8469a03447883cd37dcf67fde768d26 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Fri, 8 Oct 2021 18:34:51 +0200
Subject: [PATCH] web: update filters

---
 mitmproxy/addons/view.py             |   2 +-
 mitmproxy/tools/web/app.py           |   1 +
 test/mitmproxy/tools/web/test_app.py |   1 +
 web/src/js/__tests__/ducks/_tflow.ts |   2 +
 web/src/js/filt/filt.js              | Bin 77559 -> 87312 bytes
 web/src/js/filt/filt.peg             | 187 +++++++++++++++++++--------
 web/src/js/flow.ts                   |   1 +
 7 files changed, 142 insertions(+), 52 deletions(-)

diff --git a/mitmproxy/addons/view.py b/mitmproxy/addons/view.py
index b3b6e4f5a..4d7d750a2 100644
--- a/mitmproxy/addons/view.py
+++ b/mitmproxy/addons/view.py
@@ -330,7 +330,7 @@ class View(collections.abc.Sequence):
         self.set_filter(filt)
 
     def set_filter(self, flt: typing.Optional[flowfilter.TFilter]):
-        self.filter = flt or matchall
+        self.filter = flt or flowfilter.match_all
         self._refilter()
 
     # View Updates
diff --git a/mitmproxy/tools/web/app.py b/mitmproxy/tools/web/app.py
index 9deba965e..8746c7e8e 100644
--- a/mitmproxy/tools/web/app.py
+++ b/mitmproxy/tools/web/app.py
@@ -58,6 +58,7 @@ def flow_to_json(flow: mitmproxy.flow.Flow) -> dict:
         "type": flow.type,
         "modified": flow.modified(),
         "marked": emoji.get(flow.marked, "🔴") if flow.marked else "",
+        "comment": flow.comment,
     }
 
     if flow.client_conn:
diff --git a/test/mitmproxy/tools/web/test_app.py b/test/mitmproxy/tools/web/test_app.py
index 99cbb61bd..ae4ee0414 100644
--- a/test/mitmproxy/tools/web/test_app.py
+++ b/test/mitmproxy/tools/web/test_app.py
@@ -48,6 +48,7 @@ def test_generate_tflow_js(tdata):
     ]
     tf_http.request.trailers = Headers(trailer="qvalue")
     tf_http.response.trailers = Headers(trailer="qvalue")
+    tf_http.comment = "I'm a comment!"
 
     tf_tcp = tflow.ttcpflow(err=True)
     tf_tcp.id = "2ea7012b-21b5-4f8f-98cd-d49819954001"
diff --git a/web/src/js/__tests__/ducks/_tflow.ts b/web/src/js/__tests__/ducks/_tflow.ts
index f2685e1cc..072d78e4a 100644
--- a/web/src/js/__tests__/ducks/_tflow.ts
+++ b/web/src/js/__tests__/ducks/_tflow.ts
@@ -22,6 +22,7 @@ export function THTTPFlow(): Required<HTTPFlow> {
             "tls_established": true,
             "tls_version": "TLSv1.2"
         },
+        "comment": "I'm a comment!",
         "error": {
             "msg": "error",
             "timestamp": 946681207.0
@@ -180,6 +181,7 @@ export function TTCPFlow(): Required<TCPFlow> {
             "tls_established": true,
             "tls_version": "TLSv1.2"
         },
+        "comment": "",
         "error": {
             "msg": "error",
             "timestamp": 946681207.0
diff --git a/web/src/js/filt/filt.js b/web/src/js/filt/filt.js
index 4131311bc133a5a93356dca1f1d350f340ee5d15..3b7699362bed6a7183cb5f493de82605a729c8e7 100644
GIT binary patch
delta 5887
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%0DV$`PDeIY{x(>G+ehO6z!+4Bsd~&9T?gZ
z^)A%TxRPs4?9EiWnSG1RjP|8|YGoqRWz6~_srPMcQT9kw?x|$9)WT9$leMy6HqK|I
z^4k`6VQyx%`o(BAW_3`O=CdW~Z%T5Poq0-!L)$`o>tdm3teWuFsh0EQh{((p>fJTL
zrM-35uuAtVlZAZSJ7<F1lG@^6ZA_nmw<Q`&JzB>0XN3`x=Q`Q;nKj!}_dD53S>bPw
zq*l7v>g*AfkRQ5P2Qy@xZ;!>o@&%E_iZes}qt_OB$jf$kW)BYY+e})?P)@kn(p-LZ
z#KkJ@*OH?+Q@C;Po8fDy;cH7=Y_2PN`Z`*6r8aw*DT{-M{7WypZ+-@$`ZaAf#H>$h
z@)|p{%cp%zzi&shTe0ScCGT)3vKzCBx}$GPck=&P3%_~|VAWjQ-WwJBLZLxX@fF&V
zEnH<RIvb7pg)W!A@ckn=(eTh<G&BoO_Q$>J@F@152heOh3P@75jfg2&@9}U&XZXox
zL@~Z*Z!-VK`{I|x)c;npeOZ~~N{r12Jk}qUo2uAQ)<{Gve^kZX@@;e3l2m>*(`6|+
u7ENIh@6K`<ORb&D-pd-;ow}!nxtWQFOD$<ns4qIyzcUm|J>g?t%K1A!mtm{`

delta 3495
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

diff --git a/web/src/js/filt/filt.peg b/web/src/js/filt/filt.peg
index 987de5876..bca8bdddf 100644
--- a/web/src/js/filt/filt.peg
+++ b/web/src/js/filt/filt.peg
@@ -1,5 +1,4 @@
 // PEG.js filter rules - see https://pegjs.org/
-
 {
 function or(first, second) {
     // Add explicit function names to ease debugging.
@@ -9,6 +8,7 @@ function or(first, second) {
     orFilter.desc = first.desc + " or " + second.desc;
     return orFilter;
 }
+
 function and(first, second) {
     function andFilter() {
         return first.apply(this, arguments) && second.apply(this, arguments);
@@ -16,6 +16,7 @@ function and(first, second) {
     andFilter.desc = first.desc + " and " + second.desc;
     return andFilter;
 }
+
 function not(expr) {
     function notFilter() {
         return !expr.apply(this, arguments);
@@ -23,6 +24,7 @@ function not(expr) {
     notFilter.desc = "not " + expr.desc;
     return notFilter;
 }
+
 function binding(expr) {
     function bindingFilter() {
         return expr.apply(this, arguments);
@@ -30,22 +32,20 @@ function binding(expr) {
     bindingFilter.desc = "(" + expr.desc + ")";
     return bindingFilter;
 }
-function trueFilter(flow) {
+
+// ~all
+function allFilter(flow) {
     return true;
 }
-trueFilter.desc = "true";
-function falseFilter(flow) {
-    return false;
-}
-falseFilter.desc = "false";
+allFilter.desc = "all flows";
 
+// ~a
 var ASSET_TYPES = [
     new RegExp("text/javascript"),
     new RegExp("application/x-javascript"),
     new RegExp("application/javascript"),
     new RegExp("text/css"),
-    new RegExp("image/.*"),
-    new RegExp("application/x-shockwave-flash")
+    new RegExp("image/.*")
 ];
 function assetFilter(flow) {
     if (flow.response) {
@@ -60,13 +60,8 @@ function assetFilter(flow) {
     return false;
 }
 assetFilter.desc = "is asset";
-function responseCode(code){
-    function responseCodeFilter(flow){
-        return flow.response && flow.response.status_code === code;
-    }
-    responseCodeFilter.desc = "resp. code is " + code;
-    return responseCodeFilter;
-}
+
+// ~b
 function body(regex){
     regex = new RegExp(regex, "i");
     function bodyFilter(flow){
@@ -75,6 +70,8 @@ function body(regex){
     bodyFilter.desc = "body filters are not implemented yet, see https://github.com/mitmproxy/mitmweb/issues/10";
     return bodyFilter;
 }
+
+// ~bq
 function requestBody(regex){
     regex = new RegExp(regex, "i");
     function requestBodyFilter(flow){
@@ -83,6 +80,8 @@ function requestBody(regex){
     requestBodyFilter.desc = "body filters are not implemented yet, see https://github.com/mitmproxy/mitmweb/issues/10";
     return requestBodyFilter;
 }
+
+// ~bs
 function responseBody(regex){
     regex = new RegExp(regex, "i");
     function responseBodyFilter(flow){
@@ -91,6 +90,27 @@ function responseBody(regex){
     responseBodyFilter.desc = "body filters are not implemented yet, see https://github.com/mitmproxy/mitmweb/issues/10";
     return responseBodyFilter;
 }
+
+// ~c
+function responseCode(code){
+    function responseCodeFilter(flow){
+        return flow.response && flow.response.status_code === code;
+    }
+    responseCodeFilter.desc = "resp. code is " + code;
+    return responseCodeFilter;
+}
+
+// ~comment
+function comment(regex){
+    regex = new RegExp(regex, "i");
+    function commentFilter(flow){
+        return regex.test(flow.comment)
+    }
+    commentFilter.desc = "comment matches " + regex;
+    return commentFilter;
+}
+
+// ~d
 function domain(regex){
     regex = new RegExp(regex, "i");
     function domainFilter(flow){
@@ -99,6 +119,8 @@ function domain(regex){
     domainFilter.desc = "domain matches " + regex;
     return domainFilter;
 }
+
+// ~dst
 function destination(regex){
     regex = new RegExp(regex, "i");
     function destinationFilter(flow){
@@ -109,10 +131,14 @@ function destination(regex){
     destinationFilter.desc = "destination address matches " + regex;
     return destinationFilter;
 }
+
+// ~e
 function errorFilter(flow){
     return !!flow.error;
 }
 errorFilter.desc = "has error";
+
+// ~h
 function header(regex){
     regex = new RegExp(regex, "i");
     function headerFilter(flow){
@@ -125,6 +151,8 @@ function header(regex){
     headerFilter.desc = "header matches " + regex;
     return headerFilter;
 }
+
+// ~hq
 function requestHeader(regex){
     regex = new RegExp(regex, "i");
     function requestHeaderFilter(flow){
@@ -133,6 +161,8 @@ function requestHeader(regex){
     requestHeaderFilter.desc = "req. header matches " + regex;
     return requestHeaderFilter;
 }
+
+// ~hs
 function responseHeader(regex){
     regex = new RegExp(regex, "i");
     function responseHeaderFilter(flow){
@@ -141,10 +171,30 @@ function responseHeader(regex){
     responseHeaderFilter.desc = "resp. header matches " + regex;
     return responseHeaderFilter;
 }
+
+// ~http
 function httpFilter(flow){
     return flow.type === "http";
 }
 httpFilter.desc = "is an HTTP Flow";
+
+// ~marked
+function markedFilter(flow){
+    return flow.marked;
+}
+markedFilter.desc = "is marked";
+
+// ~marker
+function marker(regex){
+    regex = new RegExp(regex, "i");
+    function markerFilter(flow){
+        return regex.test(flow.marked)
+    }
+    markerFilter.desc = "marker matches " + regex;
+    return markerFilter;
+}
+
+// ~m
 function method(regex){
     regex = new RegExp(regex, "i");
     function methodFilter(flow){
@@ -153,18 +203,32 @@ function method(regex){
     methodFilter.desc = "method matches " + regex;
     return methodFilter;
 }
-function markedFilter(flow){
-    return flow.marked;
-}
-markedFilter.desc = "is marked";
+
+// ~q
 function noResponseFilter(flow){
     return flow.request && !flow.response;
 }
 noResponseFilter.desc = "has no response";
-function responseFilter(flow){
-    return !!flow.response;
+
+// ~replayq
+function clientReplayFilter(flow){
+    return flow.is_replay === "request";
 }
-responseFilter.desc = "has response";
+clientReplayFilter.desc = "request has been replayed";
+
+// ~replays
+function serverReplayFilter(flow){
+    return flow.is_replay === "response";
+}
+serverReplayFilter.desc = "response has been replayed";
+
+// ~replay
+function replayFilter(flow){
+    return !!flow.is_replay;
+}
+replayFilter.desc = "flow has been replayed";
+
+// ~src
 function source(regex){
     regex = new RegExp(regex, "i");
     function sourceFilter(flow){
@@ -175,6 +239,40 @@ function source(regex){
     sourceFilter.desc = "source address matches " + regex;
     return sourceFilter;
 }
+
+// ~s
+function responseFilter(flow){
+    return !!flow.response;
+}
+responseFilter.desc = "has response";
+
+// ~tcp
+function tcpFilter(flow){
+    return flow.type === "tcp";
+}
+tcpFilter.desc = "is a TCP Flow";
+
+// ~tq
+function requestContentType(regex){
+    regex = new RegExp(regex, "i");
+    function requestContentTypeFilter(flow){
+        return flow.request && regex.test(flowutils.RequestUtils.getContentType(flow.request));
+    }
+    requestContentTypeFilter.desc = "req. content type matches " + regex;
+    return requestContentTypeFilter;
+}
+
+// ~ts
+function responseContentType(regex){
+    regex = new RegExp(regex, "i");
+    function responseContentTypeFilter(flow){
+        return flow.response && regex.test(flowutils.ResponseUtils.getContentType(flow.response));
+    }
+    responseContentTypeFilter.desc = "resp. content type matches " + regex;
+    return responseContentTypeFilter;
+}
+
+// ~t
 function contentType(regex){
     regex = new RegExp(regex, "i");
     function contentTypeFilter(flow){
@@ -187,26 +285,8 @@ function contentType(regex){
     contentTypeFilter.desc = "content type matches " + regex;
     return contentTypeFilter;
 }
-function tcpFilter(flow){
-    return flow.type === "tcp";
-}
-tcpFilter.desc = "is a TCP Flow";
-function requestContentType(regex){
-    regex = new RegExp(regex, "i");
-    function requestContentTypeFilter(flow){
-        return flow.request && regex.test(flowutils.RequestUtils.getContentType(flow.request));
-    }
-    requestContentTypeFilter.desc = "req. content type matches " + regex;
-    return requestContentTypeFilter;
-}
-function responseContentType(regex){
-    regex = new RegExp(regex, "i");
-    function responseContentTypeFilter(flow){
-        return flow.response && regex.test(flowutils.ResponseUtils.getContentType(flow.response));
-    }
-    responseContentTypeFilter.desc = "resp. content type matches " + regex;
-    return responseContentTypeFilter;
-}
+
+// ~u
 function url(regex){
     regex = new RegExp(regex, "i");
     function urlFilter(flow){
@@ -215,6 +295,8 @@ function url(regex){
     urlFilter.desc = "url matches " + regex;
     return urlFilter;
 }
+
+// ~websocket
 function websocketFilter(flow){
     return flow.type === "websocket";
 }
@@ -250,19 +332,18 @@ BindingExpr
     { return binding(expr); }
   / Expr
 
-/* All the filters except "~s" and "~src" are arranged in the ascending order as
-   given in the docs(https://mitmproxy.org/docs/latest/concepts-filters/).
-   "~s" and "~src" are so arranged as "~s" caused problems in the evaluation of
-   "~src". */
+/* All the filters are generally arranged in the order as they are described
+   on https://docs.mitmproxy.org/dev/concepts-filters/, with the exception of
+    single-letter filters, which are moved to the bottom so that they evaluate properly */
 
 Expr
-  = "true" { return trueFilter; }
-  / "false" { return falseFilter; }
+  = "~all" { return allFilter; }
   / "~a" { return assetFilter; }
   / "~b" ws+ s:StringLiteral { return body(s); }
   / "~bq" ws+ s:StringLiteral { return requestBody(s); }
   / "~bs" ws+ s:StringLiteral { return responseBody(s); }
   / "~c" ws+ s:IntegerLiteral { return responseCode(s); }
+  / "~comment" ws+ s:StringLiteral { return comment(s); }
   / "~d" ws+ s:StringLiteral { return domain(s); }
   / "~dst" ws+ s:StringLiteral { return destination(s); }
   / "~e" { return errorFilter; }
@@ -270,15 +351,19 @@ Expr
   / "~hq" ws+ s:StringLiteral { return requestHeader(s); }
   / "~hs" ws+ s:StringLiteral { return responseHeader(s); }
   / "~http" { return httpFilter; }
-  / "~m" ws+ s:StringLiteral { return method(s); }
   / "~marked" { return markedFilter; }
+  / "~marker" ws+ s:StringLiteral { return marker(s); }
+  / "~m" ws+ s:StringLiteral { return method(s); }
   / "~q" { return noResponseFilter; }
+  / "~replayq" { return clientReplayFilter; }
+  / "~replays" { return serverReplayFilter; }
+  / "~replay" { return replayFilter; }
   / "~src" ws+ s:StringLiteral { return source(s); }
   / "~s" { return responseFilter; }
-  / "~t" ws+ s:StringLiteral { return contentType(s); }
   / "~tcp" { return tcpFilter; }
   / "~tq" ws+ s:StringLiteral { return requestContentType(s); }
   / "~ts" ws+ s:StringLiteral { return responseContentType(s); }
+  / "~t" ws+ s:StringLiteral { return contentType(s); }
   / "~u" ws+ s:StringLiteral { return url(s); }
   / "~websocket" { return websocketFilter; }
   / s:StringLiteral { return url(s); }
diff --git a/web/src/js/flow.ts b/web/src/js/flow.ts
index 5f79425d0..1d46b027d 100644
--- a/web/src/js/flow.ts
+++ b/web/src/js/flow.ts
@@ -8,6 +8,7 @@ interface _Flow {
     type: string
     modified: boolean
     marked: string
+    comment: string
     client_conn: Client
     server_conn?: Server
     error?: Error