Skip to content
Chrome extension that replaces new tab page with widgets and fresh image every day.
TypeScript JavaScript HTML
Branch: master
Clone or download
Type Name Latest commit message Commit time
Failed to load latest commit information.
assets add extension icon Aug 21, 2019
scripts release script checkes changelog date, clenup of paths Aug 27, 2019
.prettierrc add prettier and verify script Jun 21, 2019
LICENSE Initial commit Aug 6, 2017 readme typos Sep 28, 2019
package-lock.json update dependencies Oct 7, 2019
package.json update dependencies Oct 7, 2019
tsconfig.json bunch of stuff Mar 5, 2019



  • install npm ci
  • run in development mode npm run start
  • run tests, type check and prettier check npm run validate
  • build npm run build


  • check if is properly filled add date is updated
  • up versions in, package.json and manifest.json
  • run node ./scripts/release.js

Random notes

  • Chrome CSP
    • Because of Chrome plugins CSP policy we cannot have inline scripts unless we mention their sha256+base64 value in manifest.json in content_security_policy field. Create React App includes some inline scripts by default so we would either need to have some build pipeline that extracts these scripts value and ads its sha256+base64 into manifest.json or we could use INLINE_RUNTIME_CHUNK=false environment variable that puts these scripts into external file.
    • Another inline script is window.GLOBAL_PERF_TIMESTAMP =; that is used for performance measuring. This one is added manually into manifest.json. Side note: performance.timeOrigin seemed to return wrong timings, investigate further in the future
  • Create React App does not support testing files that have name test.ts, only files with *.test.ts or *.spec.ts patterns, so we go around this by calling tests spec.test.ts
  • Global state is available in dev mode on window._state.


  • There was an error trying to load the config "styledComponents" for the macro imported from "styled-components/macro. Please see the error thrown for more information
  • @types/styled-components 4.1.8 ❯ 4.1.16
  • typescript 3.4.5 ❯ 3.5.2
    • WARNING: You are currently running a version of TypeScript which is not officially supported by typescript-estree
  • @types/css-font-loading-module
    • once window.FontFace becomes standardized, remove
  • resize-observer-polyfill
    • remove polyfill, once supported by browsers
  • wicg-inert
    • remove polyfill, once supported by browsers
  • focus-visible
    • remove polyfill, once supported by browsers
    • remove .focus-visible class and use directly :focus-visible


  • Icon by Alice Noir with slight modifications by me.


TODO nice to have

  • hotkeys to toggle calendar/time
    • write about it in settings
  • chrome store
    • images without settings button
  • cors proxy
    • on now
    • on heroku?
  • fonts
    • precise cap-height boundaries for fonts
    • Text component?
  • hotkeys (esc) do not work when input is focused
  • when settings has focus, show it on minimalist view
  • show changelog somewhere in menu
  • show location and links somewhere else and somewhere more visible accessible?
    • main reasoning: you will use the settings once at the beginning, then you will only look what is on the picture etc
  • decimal places in age configurable
  • animations
    • use react-spring
    • animate view transitions
    • animate menu height
    • also menu bugs
      • no when menu height content is extended, it lags behind content
      • when menu height content is collapsed, it happens instantly
    • animate text appear/disappear in menu
  • background image switching seems slow and buggy sometimes
  • fix tests
  • resolve all todos in code
  • conditional updated is broken when we change clocks showSeconds prop, overall behavior seems strange investigate!
You can’t perform that action at this time.