Skip to content

Commit

Permalink
Merge pull request #110 from manojVivek/delete-cookie
Browse files Browse the repository at this point in the history 
#104 - Option to delete cookies and storage
  • Loading branch information
@manojVivek
manojVivek committed May 25, 2020
2 parents 27081fd + 09277ca commit 1f4a9c2
Show file tree
Hide file tree
Showing 12 changed files with 246 additions and 27 deletions.
3 changes: 2 additions & 1 deletion desktop-app/.vscode/settings.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,6 @@
"npm-debug.log.*": true,
"test/**/__snapshots__": true,
"yarn.lock": true
}
},
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
26 changes: 26 additions & 0 deletions desktop-app/app/actions/browser.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
SCREENSHOT_ALL_DEVICES,
FLIP_ORIENTATION_ALL_DEVICES,
ENABLE_INSPECTOR_ALL_DEVICES,
DELETE_STORAGE,
} from '../constants/pubsubEvents';

export const NEW_ADDRESS = 'NEW_ADDRESS';
Expand Down Expand Up @@ -357,3 +358,28 @@ export function triggerNavigationReload(_, args) {
pubsub.publish(NAVIGATION_RELOAD, [{ignoreCache}]);
};
}

export function deleteCookies() {
return (dispatch: Dispatch, getState: RootStateType) => {
pubsub.publish(DELETE_STORAGE, [{storages: ['cookies']}]);
};
}

export function deleteStorage() {
return (dispatch: Dispatch, getState: RootStateType) => {
pubsub.publish(DELETE_STORAGE, [
{
storages: [
'appcache',
'filesystem',
'indexdb',
'localstorage',
'shadercache',
'websql',
'serviceworkers',
'cachestorage',
],
},
]);
};
}
83 changes: 63 additions & 20 deletions desktop-app/app/components/Addressinput/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
// @flow
import React from 'react';
import cx from 'classnames';
import GoArrowIcon from '../icons/GoArrow';
import HomePlusIcon from '../icons/HomePlus';
import DeleteCookieIcon from '../icons/DeleteCookie';
import DeleteStorageIcon from '../icons/DeleteStorage';
import {iconsColor} from '../../constants/colors';

import commonStyles from '../common.styles.css';
Expand Down Expand Up @@ -55,25 +56,67 @@ class AddressBar extends React.Component<Props> {
onKeyDown={this._handleKeyDown}
onChange={e => this.setState({userTypedAddress: e.target.value})}
/>
<div
className={cx(styles.goButton, commonStyles.icons, {
[commonStyles.enabled]: this.props.address !== this.props.homepage,
[commonStyles.disabled]: this.props.address == this.props.homepage,
})}
>
<Tooltip title="Set a Homepage">
<div
className={cx(commonStyles.flexAlignVerticalMiddle)}
onClick={this.props.setHomepage}
>
<HomePlusIcon
height={22}
width={22}
color={iconsColor}
padding={5}
/>
</div>
</Tooltip>
<div className={cx(styles.floatingOptionsContainer)}>
<div
className={cx(commonStyles.icons, commonStyles.roundIcon, {
[commonStyles.enabled]: true,
})}
>
<Tooltip title="Delete Storage">
<div
className={cx(commonStyles.flexAlignVerticalMiddle)}
onClick={this.props.deleteStorage}
>
<DeleteStorageIcon
height={22}
width={22}
color={iconsColor}
padding={5}
/>
</div>
</Tooltip>
</div>
<div
className={cx(commonStyles.icons, commonStyles.roundIcon, {
[commonStyles.enabled]: true,
})}
>
<Tooltip title="Delete Cookies">
<div
className={cx(commonStyles.flexAlignVerticalMiddle)}
onClick={this.props.deleteCookies}
>
<DeleteCookieIcon
height={22}
width={22}
color={iconsColor}
padding={5}
/>
</div>
</Tooltip>
</div>
<div
className={cx(commonStyles.icons, commonStyles.roundIcon, {
[commonStyles.enabled]:
this.props.address !== this.props.homepage,
[commonStyles.disabled]:
this.props.address == this.props.homepage,
})}
>
<Tooltip title="Set a Homepage">
<div
className={cx(commonStyles.flexAlignVerticalMiddle)}
onClick={this.props.setHomepage}
>
<HomePlusIcon
height={22}
width={22}
color={iconsColor}
padding={5}
/>
</div>
</Tooltip>
</div>
</div>
</div>
);
Expand Down
4 changes: 2 additions & 2 deletions desktop-app/app/components/Addressinput/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@
border: solid 1px #7587ec;
}

.goButton {
.floatingOptionsContainer {
position: absolute;
display: flex;
right: 5px;
border-radius: 50%;
}
8 changes: 8 additions & 0 deletions desktop-app/app/components/WebView/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
FLIP_ORIENTATION_ALL_DEVICES,
ENABLE_INSPECTOR_ALL_DEVICES,
DISABLE_INSPECTOR_ALL_DEVICES,
DELETE_STORAGE,
} from '../../constants/pubsubEvents';
import {CAPABILITIES} from '../../constants/devices';

Expand Down Expand Up @@ -78,6 +79,9 @@ class WebView extends Component {
this.subscriptions.push(
pubsub.subscribe(NAVIGATION_RELOAD, this.processNavigationReloadEvent)
);
this.subscriptions.push(
pubsub.subscribe(DELETE_STORAGE, this.processDeleteStorageEvent)
);
this.subscriptions.push(
pubsub.subscribe(SCREENSHOT_ALL_DEVICES, this.processScreenshotEvent)
);
Expand Down Expand Up @@ -215,6 +219,10 @@ class WebView extends Component {
this.webviewRef.current.reload();
};

processDeleteStorageEvent = ({storages}) => {
this.getWebContents().session.clearStorageData({storages});
};

processScrollEvent = message => {
if (
this.state.isUnplugged ||
Expand Down
4 changes: 4 additions & 0 deletions desktop-app/app/components/common.styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@
border-radius: 5px;
}

.roundIcon {
border-radius: 50%;
}

.icons.disabled {
opacity: 0.3;
cursor: auto;
Expand Down
67 changes: 67 additions & 0 deletions desktop-app/app/components/icons/DeleteCookie.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
import React, {Fragment} from 'react';

export default ({width, height, color, padding, margin}) => (
<Fragment>
<svg
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
style="isolation:isolate"
viewBox="0 0 512 512"
height={height}
width={width}
fill={color}
stroke={color}
style={{padding, margin}}
className="deleteCookieIcon"
>
<defs>
<clipPath id="_clipPath_pH9XtWjIaRon0vADT01aeJAr0MOn4OX2">
<rect width="512" height="512" />
</clipPath>
</defs>
<g clipPath="url(#_clipPath_pH9XtWjIaRon0vADT01aeJAr0MOn4OX2)">
<path
d=" M 136 216 L 106 216 C 103.348 216 100.804 217.054 98.929 218.929 L 68.929 248.929 C 65.024 252.834 65.024 259.166 68.929 263.072 L 98.929 293.072 C 100.804 294.947 103.348 296.001 106 296.001 L 166 296.001 C 169.466 296.001 172.685 294.206 174.506 291.258 C 176.328 288.311 176.494 284.629 174.944 281.529 L 144.944 221.529 C 143.25 218.14 139.788 216 136 216 Z M 110.142 276 L 90.142 256 L 110.142 236 L 129.82 236 L 149.82 276 L 110.142 276 Z "
fill="rgb(255,255,255)"
/>
<path
d=" M 346 386 L 406 386 C 408.652 386 411.196 384.946 413.071 383.071 L 443.071 353.071 C 446.976 349.166 446.976 342.834 443.071 338.928 L 413.071 308.928 C 411.196 307.054 408.652 306 406 306 L 376 306 C 372.212 306 368.75 308.14 367.056 311.528 L 337.056 371.528 C 335.506 374.628 335.672 378.309 337.494 381.257 C 339.315 384.205 342.534 386 346 386 Z M 382.18 326 L 401.858 326 L 421.858 346 L 401.858 366 L 362.18 366 L 382.18 326 Z "
fill="rgb(0,0,0)"
/>
<path
d=" M 196 146 L 256 146 C 259.466 146 262.685 144.205 264.506 141.257 C 266.328 138.31 266.494 134.628 264.944 131.528 L 234.944 71.528 C 233.25 68.14 229.788 66 226 66 L 196 66 C 193.348 66 190.804 67.054 188.929 68.929 L 158.929 98.929 C 155.024 102.834 155.024 109.166 158.929 113.072 L 188.929 143.072 C 190.804 144.946 193.348 146 196 146 L 196 146 Z M 200.142 86 L 219.82 86 L 239.82 126 L 200.142 126 L 180.142 106 L 200.142 86 Z "
fill="rgb(255,255,255)"
/>
<path
d=" M 161.528 384.944 L 221.528 414.944 C 222.949 415.655 224.479 416 225.997 416 C 228.591 416 231.151 414.991 233.071 413.071 L 263.071 383.071 C 264.946 381.195 266 378.652 266 376 L 266 346 C 266 340.478 261.523 336 256 336 L 196 336 C 193.348 336 190.804 337.054 188.929 338.929 L 158.929 368.929 C 156.656 371.202 155.615 374.429 156.129 377.602 C 156.644 380.774 158.653 383.507 161.528 384.944 L 161.528 384.944 Z M 200.142 356 L 246 356 L 246 371.857 L 224.025 393.832 L 182.881 373.261 L 200.142 356 Z "
fill="rgb(255,255,255)"
/>
<path
d=" M 323.071 263.071 L 353.071 233.071 C 355.344 230.798 356.385 227.571 355.871 224.398 C 355.356 221.225 353.347 218.493 350.472 217.055 L 290.472 187.055 C 286.621 185.13 281.973 185.885 278.929 188.928 L 248.929 218.928 C 247.054 220.805 246 223.348 246 226 L 246 256 C 246 261.522 250.477 266 256 266 L 316 266 C 318.652 266 321.196 264.946 323.071 263.071 Z M 266 246 L 266 230.143 L 287.975 208.168 L 329.119 228.739 L 311.858 246 L 266 246 Z "
fill="rgb(255,255,255)"
/>
<circle
vectorEffect="non-scaling-stroke"
cx="468"
cy="378"
r="10"
fill="rgb(0,0,0)"
/>
<path
d=" M 503.483 210.456 C 500.633 208.991 497.254 208.98 494.394 210.428 C 487.912 213.709 477.47 216 469 216 C 440.767 216 416 192.636 416 166 C 416 160.478 411.523 156 406 156 C 378.43 156 356 133.57 356 106 C 356 100.478 351.523 96 346 96 C 319.364 96 296 71.233 296 43 C 296 34.538 298.292 24.094 301.574 17.602 C 303.019 14.743 303.008 11.364 301.542 8.515 C 300.076 5.666 297.334 3.693 294.168 3.206 C 279.927 1.019 267.799 0 256 0 C 117.659 0 0 118.201 0 256 C 0 394.121 117.976 512 256 512 C 330.553 512 400.878 477.456 449.394 421.103 C 452.998 416.917 452.526 410.604 448.34 407 C 444.155 403.396 437.84 403.869 434.237 408.054 C 418.318 426.543 399.939 442.435 379.536 455.394 L 353.071 428.929 C 351.196 427.054 348.652 426 346 426 L 316 426 C 312.212 426 308.749 428.141 307.056 431.528 L 277.346 490.957 C 270.238 491.639 263.082 492 256 492 C 194.14 492 133.684 465.826 88.672 419.9 L 113.071 395.501 C 114.946 393.625 116 391.082 116 388.43 L 116 346 C 116 342.785 114.455 339.767 111.847 337.888 C 109.239 336.008 105.885 335.495 102.838 336.514 L 43.563 356.273 C 28.135 324.739 20 290.252 20 256 C 20 226.825 25.643 198.269 36.766 170.908 L 38.929 173.071 C 40.804 174.946 43.348 176 46 176 L 106 176 C 109.466 176 112.685 174.205 114.506 171.257 C 116.328 168.31 116.494 164.628 114.944 161.528 L 84.944 101.528 C 84.361 100.361 83.556 99.355 82.612 98.521 C 127.814 49.076 191.401 20 256 20 C 263.302 20 270.791 20.436 278.98 21.35 C 277.092 28.364 276 36.021 276 43 C 276 79.262 302.916 110.366 336.617 115.314 C 340.778 146.478 365.521 171.221 396.685 175.382 C 401.634 209.084 432.739 236 469 236 C 475.982 236 483.639 234.908 490.65 233.021 C 491.565 241.21 492 248.698 492 256 C 492 282.473 487.292 308.697 478.008 333.945 C 476.102 339.129 478.759 344.876 483.943 346.782 C 489.125 348.689 494.874 346.031 496.78 340.847 C 506.879 313.383 512 284.836 512 256 C 512 244.201 510.981 232.073 508.794 217.832 C 508.308 214.664 506.333 211.922 503.483 210.456 Z M 322.181 446 L 341.858 446 L 361.611 465.754 C 342.412 475.785 322.301 482.992 301.531 487.298 L 322.181 446 Z M 96 384.287 L 75.244 405.043 C 67.102 395.279 59.753 384.934 53.271 374.117 L 96 359.874 L 96 384.287 Z M 89.82 156 L 50.142 156 L 45.661 151.519 C 52.037 139.118 59.55 127.217 68.051 116 L 69.82 116 L 89.82 156 Z "
fill="rgb(255,255,255)"
/>
<g>
<path
d=" M 389.675 263.675 C 322.222 263.675 267.35 318.547 267.35 386 C 267.35 453.453 322.222 508.325 389.675 508.325 C 457.128 508.325 512 453.453 512 386 C 512 318.547 457.128 263.675 389.675 263.675 Z "
fill="rgb(244,67,54)"
/>
<path
d=" M 434.722 416.632 C 438.707 420.619 438.707 427.06 434.722 431.047 C 432.734 433.035 430.125 434.033 427.513 434.033 C 424.904 434.033 422.295 433.035 420.307 431.047 L 389.675 400.413 L 359.043 431.047 C 357.055 433.035 354.446 434.033 351.837 434.033 C 349.225 434.033 346.616 433.035 344.628 431.047 C 340.643 427.06 340.643 420.619 344.628 416.632 L 375.262 386 L 344.628 355.368 C 340.643 351.381 340.643 344.94 344.628 340.953 C 348.615 336.968 355.056 336.968 359.043 340.953 L 389.675 371.587 L 420.307 340.953 C 424.294 336.968 430.735 336.968 434.722 340.953 C 438.707 344.94 438.707 351.381 434.722 355.368 L 404.088 386 L 434.722 416.632 Z "
fill="rgb(250,250,250)"
/>
</g>
</g>
</svg>
</Fragment>
);
68 changes: 68 additions & 0 deletions desktop-app/app/components/icons/DeleteStorage.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
import React, {Fragment} from 'react';

export default ({width, height, color, padding, margin}) => (
<Fragment>
<svg
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
style="isolation:isolate"
viewBox="0 0 512 512"
height={height}
width={width}
fill={color}
stroke={color}
style={{padding, margin}}
className="deleteStorageIcon"
>
<defs>
<clipPath id="_clipPath_qbuwJBHdB5UgzBtLzd9gB6R7rRnewpsN">
<rect width="512" height="512" />
</clipPath>
</defs>
<g clipPath="url(#_clipPath_qbuwJBHdB5UgzBtLzd9gB6R7rRnewpsN)">
<g>
<g>
<path
d=" M 256 0 C 136.384 0 42.667 42.176 42.667 96 C 42.667 149.824 136.384 192 256 192 C 375.616 192 469.333 149.824 469.333 96 C 469.333 42.176 375.616 0 256 0 Z M 256 170.667 C 142.848 170.667 64 131.307 64 96 C 64 60.693 142.848 21.333 256 21.333 C 369.152 21.333 448 60.693 448 96 C 448 131.307 369.152 170.667 256 170.667 Z "
fill="rgb(255,255,255)"
/>
</g>
</g>
<g>
<g>
<path
d=" M 458.667 192 C 452.779 192 448 196.779 448 202.667 C 448 237.974 369.152 277.334 256 277.334 C 142.848 277.334 64 237.974 64 202.667 C 64 196.779 59.221 192 53.333 192 C 47.445 192 42.666 196.779 42.666 202.667 C 42.666 256.491 136.383 298.667 255.999 298.667 C 375.615 298.667 469.332 256.491 469.332 202.667 C 469.333 196.779 464.555 192 458.667 192 Z "
fill="rgb(255,255,255)"
/>
</g>
</g>
<g>
<g>
<path
d=" M 458.667 298.667 C 452.779 298.667 448 303.446 448 309.334 C 448 344.64 369.152 384 256 384 C 142.848 384 64 344.64 64 309.333 C 64 303.445 59.221 298.666 53.333 298.666 C 47.445 298.666 42.666 303.445 42.666 309.333 C 42.666 363.157 136.383 405.333 255.999 405.333 C 375.615 405.333 469.332 363.157 469.332 309.333 C 469.333 303.445 464.555 298.667 458.667 298.667 Z "
fill="rgb(255,255,255)"
/>
</g>
</g>
<g>
<g>
<path
d=" M 458.667 85.333 C 452.779 85.333 448 90.112 448 96 L 448 416 C 448 451.307 369.152 490.667 256 490.667 C 142.848 490.667 64 451.307 64 416 L 64 96 C 64 90.112 59.221 85.333 53.333 85.333 C 47.445 85.333 42.667 90.112 42.667 96 L 42.667 416 C 42.667 469.824 136.384 512 256 512 C 375.616 512 469.333 469.824 469.333 416 L 469.333 96 C 469.333 90.112 464.555 85.333 458.667 85.333 Z "
fill="rgb(255,255,255)"
/>
</g>
</g>
<g>
<path
d=" M 388 264 C 319.624 264 264 319.624 264 388 C 264 456.376 319.624 512 388 512 C 456.376 512 512 456.376 512 388 C 512 319.624 456.376 264 388 264 Z "
fill="rgb(244,67,54)"
/>
<path
d=" M 433.664 419.051 C 437.703 423.093 437.703 429.622 433.664 433.664 C 431.649 435.679 429.003 436.691 426.356 436.691 C 423.711 436.691 421.066 435.679 419.051 433.664 L 388 402.611 L 356.949 433.664 C 354.934 435.679 352.289 436.691 349.644 436.691 C 346.997 436.691 344.351 435.679 342.336 433.664 C 338.297 429.622 338.297 423.093 342.336 419.051 L 373.389 388 L 342.336 356.949 C 338.297 352.907 338.297 346.378 342.336 342.336 C 346.378 338.297 352.907 338.297 356.949 342.336 L 388 373.389 L 419.051 342.336 C 423.093 338.297 429.622 338.297 433.664 342.336 C 437.703 346.378 437.703 352.907 433.664 356.949 L 402.611 388 L 433.664 419.051 Z "
fill="rgb(250,250,250)"
/>
</g>
</g>
</svg>
</Fragment>
);
1 change: 1 addition & 0 deletions desktop-app/app/constants/pubsubEvents.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ export const SCROLL_UP = 'SCROLL_UP';
export const NAVIGATION_BACK = 'NAVIGATION_BACK';
export const NAVIGATION_FORWARD = 'NAVIGATION_FORWARD';
export const NAVIGATION_RELOAD = 'NAVIGATION_RELOAD';
export const DELETE_STORAGE = 'DELETE_STORAGE';
export const SCREENSHOT_ALL_DEVICES = 'SCREENSHOT_ALL_DEVICES';
export const FLIP_ORIENTATION_ALL_DEVICES = 'FLIP_ORIENTATION_ALL_DEVICES';
export const ENABLE_INSPECTOR_ALL_DEVICES = 'ENABLE_INSPECTOR_ALL_DEVICES';
Expand Down
7 changes: 3 additions & 4 deletions desktop-app/app/containers/AddressBar/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ const AddressBar = function(props) {
onChange={props.onAddressChange}
homepage={props.browser.homepage}
setHomepage={props.setCurrentAddressAsHomepage}
deleteCookies={props.deleteCookies}
deleteStorage={props.deleteStorage}
/>
);
};
Expand All @@ -33,7 +35,4 @@ function mapDispatchToProps(dispatch) {
return bindActionCreators(BrowserActions, dispatch);
}

export default connect(
mapStateToProps,
mapDispatchToProps
)(AddressBar);
export default connect(mapStateToProps, mapDispatchToProps)(AddressBar);

0 comments on commit 1f4a9c2

Please sign in to comment.