GNU Emacs: A configurable browser

Now you can use GNU Emacs as a full featured browser. It uses webkit2gtk for rendering. Here's a short video demonstrating the features.



Hit-a-hint

Developer tools


Features:
- Adblock
- Disabled tracking API (navigator.sendBeacon())
- Inline videos à la Youtube
- Hit-a-Hint
- Keyboard based navigation: left/right character for left/right scroll, prev/next line, prev/next page, beginning/end of buffer for top/end of page, +/-/z for zoom in/out/reset
- Multi-input modes: single key interactive mode, line input mode via minibuffer and textarea input mode via new buffer
- Password auto-fill and management via authinfo
- Configurable Home page and search URL
- Bookmarks
- Download unsupported mime types
- User script à la Tampermonkey / Greasemonkey
- User styles
- Developer tools / Web Inspector

Finally you can have a browser as you want.


Code:
https://gitlab.com/atamariya/emacs/-/blob/dev/src/xwidget.c

https://gitlab.com/atamariya/emacs/-/blob/dev/lisp/xwidget.el
https://gitlab.com/atamariya/emacs/-/blob/dev/lisp/webkit/webkit-ace.el

https://gitlab.com/atamariya/emacs/-/blob/dev/etc/webkit/hints.js
https://gitlab.com/atamariya/emacs/-/blob/dev/etc/webkit/hints.css

 

Build

Right now, it's a custom fork from an old version of Emacs. There's a competing implementation available in Emacs master branch. Till this code gets merged in Emacs master, you can build it from dev branch at https://gitlab.com/atamariya/emacs .

git clone --depth 1 https://gitlab.com/atamariya/emacs.git
cd emacs
git checkout dev
./configure --with-xwidgets
make && sudo make install

 

Custom Theme

In terms of appearance, browser provides full control to webpage author. Your default theme will only work if the author doesn't override those definitions. However, you can force your theme by loading it via custom JS which always runs last. You can define your custom CSS in hints.css .


References

  1. Hit-a-hint https://github.com/akirakyle/emacs-webkit


Comments

Post a Comment

Popular posts from this blog

GNU Emacs as a Comic Book Reader

Image
  Comics are available in digital format as a collection of images in a compressed ZIP or RAR file (.cbz or .cbr file extension respectively). These can be enjoyed in GNU Emacs with full access to image viewing capabilities using keybindings.   # Make sure you have unrar installed for CBR files # apt install unrar   (require 'arc2-mode)   (setq archive-summarize-files-fn 'archive-summarize-files-as-thumb)     Note: The archive-mode is capable of displaying the list of files in an archive; though it depends on external tools for extraction. For JPG and PNG, Emacs can resize the image without external convertor (ie. imagemagick). However, some menu options for image transformations in image-mode might not be available. Use the following patch for image-mode.el . @@ -460,16 +460,16 @@ image-mode-map       :help "Show image as hex"]      "--"      ["Fit to Window Height" image-transform-fit-to-...
Read more

HTML Renderer (Emacs)

Image
  Emacs: A non-intrusive browser An Elisp implementation of HTML rendering using SVG. The browser functionality is an extension of eww . For Javascript, you can use either NodeJS or QuickJS as a JS interpreter . Developer Note: The entry point is shr-render.   Table Colspan example Rowspan example Sample Table <html>   <body>     <table border="1">       <tr bgcolor="#9acd32">         <th style="text-align:left">Title</th>         <th style="text-align:left">Artist</th>       </tr>       <tr>         <td>Empire Burlesque</td>         <td>Bob Dylan</td>       </tr>     </table>   </body> </html...
Read more

Mozilla Readability in GNU Emacs

Image
  Output using Readability (left) and original eww (right)   Mozilla Readability is a standalone version of the readability library used for Firefox Reader View . A simple hack to eww can bring the same feature in GNU Emacs. ( Note: eww already has a readable mode. This is just an alternative. Updated the post to reflect the same.)   - Install NodeJS   - Install npm modules. npm install @mozilla/readability jsdom   - Create a file readability.js with following content. Note the file location. var { Readability } = require('@mozilla/readability'); var { JSDOM } = require('jsdom'); var fs = require("fs"); var str = fs.readFileSync(process.stdin.fd).toString(); var doc = new JSDOM(str); var reader = new Readability(doc.window.document); var article = reader.parse(); console.log(article.content);     - Modify the following function to use the file location noted above . Evaluate the function. (defun mozilla-readability (start end)   (shell-command-o...
Read more