google-chrome-extensionmicrosoft-edge-extension

Chrome/Edge extension with current time as tab-title


How can I develop a Chrome/Edge extension that always displays the current time in the tab title before the actual title?


Solution

  • 1.) Create new folder "time2tab".

    2.) Put new file "manifest.js" in it:

    {
      "manifest_version": 3,
      "name": "time2tab",
      "version": "1.0",
      "description": "A simple Chrome extension that changes the title of the current tab to the current timestamp.",
      "content_scripts": [
        {
          "matches": [
            "<all_urls>"
          ],
          "js": [
            "content.js"
          ]
        }
      ]
    }
    

    3.) Put new file "content.js" in it:

    var originalTitel = document.title;
      
    function updateTime() {
      
      var now = new Date();
      var hours = now.getHours();
      var minutes = now.getMinutes();
      var seconds = now.getSeconds();
      var tenthOfASecond = Math.floor(now.getMilliseconds() / 100);
      
      var timeString = hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0') + '.' + tenthOfASecond.toString();
      
      document.title = timeString + " " + originalTitel;
      
    }
     
    setInterval(updateTime, 100);
    

    4.) Aktivate Developer mode in Extensions-Tab. Load the folder via Load unpacked.

    Use cases for this extension: