FragmentQR

Developed by Yonah Aviv

Version

Summary

FragmentQR is a QR-code generator that can additionally copy links to snippets of text on a webpage.

Introduction

FragmentQR adds a an option to the context menu to copy a link to a snippet of text on a webpage, and within the extension popup you can share that that link usinga QR code.

Getting Started

Installation

FragmentQR is available on 2 different extension stores:

Instructions

Select some text
Open context menu and click “copy link …. to selected text” to copy text fragment
- tip: use Alt + Shift + L instead
Click the extension toolbar icon to open the popup
- tip: use Alt + Q to Open Popup
Click the blue paste button the text fragment link into the popup to generate a QR code.

When someone scans that QR or just goes to the link you copied, A feature called Scroll to text fragment allows the text fragment to be detected when they load the webpage, and will scroll your selected text into view and be highlighted in yellow 🟨.

Note: Currently scanning the QR code to see the highlights will mostly only work on Android, but there may be functionality on iOS soon

Once either you or someone else scans the QR code and opens the URL, the browser will open the original webpage and scorll to the selected text which will be highlighted in yellow.

Supported Browsers

Currently, text fragments are supports in these browsers: note: these are all chromium browsers

Chrome 81+ and Microsoft Edge 83+ on all major desktop platforms(mac/win/lin)
Google Chrome 90+ on Android
Chrome 90+ for Android WebView
Opera 62+
(Partial)Chrome for iOS: latest version, must enable in chrome://flags

Background

Text Fragments

ℹText Fragments: Part of a URL that specifies a piece of text emphasized on page load and scrolled into view, not unlike a text anchor.

“Text Fragments adds support for specifying a text snippet in the URL fragment. When navigating to a URL with such a fragment, the user agent can quickly emphasise and/or bring it to the user’s attention.”¹

Syntax of Text Fragment URL

Syntax: https://foo.bar/#:~:text=yoursnippet

The text fragment can be specified in the fragment directive, which will always be after in the URL fragment of the URL, after #(there may be a word after the # but before :~:, and that would be another kind of fragment, but it’s all good). The fragment directive delimiter is the following string: :~:. You can specify text=yoursnippet after it and in chromium browsers, and some other browsers, yoursnippet will be scrolled into view and highlighted, when opened.

Example

Consider the following URL:

https://en.wikipedia.org/wiki/Probability_distribution#cite_ref-:1_3-0:~:textStart=Examples of random phenomena include the weather condition in a future date

If we take our previous url(https://foo.bar/#:~:text=yoursnippet) and map it out to this URL, we would get:

`https://foo.bar/#:~:text=yoursnippet`	`https://en.wikipedia.org/wiki/Probability_distribution...`
`foo.bar`	`en/wikipedia.org`
`#`	`#cite_ref-:1_3-0`
`yoursnippet`	`Examples of random phenomena include the weather condition in a future date`

Update on text fragments: In Chrome 87, there is a new flag in chrome://flags that adds “copy link to text” to the context menu on Android and Desktop. However in the latest version of chrome as of November 23, 2020, it does not work.

Update Dec 2020: Chrome 88(beta) by default has the copy link to text item in the context menu and it is functional. Hopefully if it get’s carried to the stable version and get more documentation and an API.

Supported Browsers + OSs

(Mentioned above already, but herea more in depth answer:) Since the QR code contains the text fragment link, the QR code and the link are the same. The yellow highlight comes from the Scroll to text fragment feature, so this will answer:

Which browsers and OSs support Scroll to text fragment or a feature similar to it?

Scroll to text fragment is a feature in Chromium-based browsers[2] . There may be similar features in other browsers.

Mobile operating systems(I need to recheck these, so they may be out of date)

Android works(check browsers below)
iOS doesn’t work(yet)
IPadOS to be determined

All other devices(using the text fragment URL) 4. Pretty much the same browsers work on Mac, Windows, and Linux but still check to make sure whoever you send the link to is running one of the OS/browser combination below.

Let me know if you want your operating system or browser to appear in the table below.

Operating System	Browser Version
Android	Chrome 85, Android WebView 81, Samsung Internet latest.(could be more)
Windows	Microsoft Edge 83, Chrome 80, Opera 68
Linux	Microsoft Edge 83, Chrome 80, Opera 68
Mac OS X	Microsoft Edge 83, Chrome 80, Opera 68
iOS	N/A. Could come in early 2021.

Check current status

Remember, Fragment is also a functional QR code generator, so even if you cannot use text fragments, you can skip to step 3 of the instructions steps

Want more informations?

Check out our FAQ on the Fragment QR Wiki

If you still are in need of an answer feel free to email me with your question

Issues and Changelog

Known issues

Theme does not save when changed in options
Due to a dependancy on material icon font library, the icon font turns into whatever the icon is called when offline and the library is inaccesibe, so the buttons are messed up when offline
🛑If you find an issue, open a new issue in this repository or post it in the support tab on the Chrome Web Store

Changelog v1.8.1

(Released on ✔Chrome Web Store, ✔Updated code in repository, ❌Github release, ❌Edge Add-ons)
✔documentation for how to use, ✔/2 updated pictures, and ❌tutorial video, are coming soon
1. You can now use the paste button, however there is still a bug that i will fix next release so be aware
2. Added 1 updated screenshot

Changelog v1.8.0

(Released on ✔chrome web store, ✔Updated code in repository, and ❌Github release + ❌Edge Add-ons will be coming soon)
❌documentation for how to use, ❌updated pictures, and ❌tutorial video, are coming soon
1. Feature improvements, and interface redesigns.
2. There are some bugs: For now, do not use the paste button, I am working on something that will be much better than it as a replacement.
3. new logo
4. Full changelog coming soon

Changelog v1.7.2

Changed options page
New icon
Now available on Microsoft Edge Add-ons
Updated description

Changelog v1.7.1

Fixed Issue # 9: Unable to copy text fragments in version 1.7 #9

Changelog v1.7

Fixed Issue # 5: QR now update automatically when typing in the text box
Revamped options page
minor fixes

Changelog v1.6

Fix issue when system theme is set to light</li>
Minor improvements
QR does not update automatically when typing in the text box #5
- Until fixed, a workaround is: After you finish typing click the copy button and then the paste button. The QR code will only update when the paste button is clicked.

Changelog v1.5

New icon and name changes to FragmentQR
Paste button now works.
Vast UI and functionality improvements
Added support for copying text framents
Added keyboard shortcuts
Light theme(currently does not save between sessions)

TODO

References

1: - Scroll-to-text-fragment(WICG)

Privacy policy

I, the developer, attest to the claim that the browser extension FragmentQR does not collect any personal identification information of users whatsoever, and that all other data is stored locally on the user’s device.

For the full privacy policy, go to the privacy policy

Developed and Designed by Yonah Aviv

Buy me a coffee

Fragment QR uses some icons from Google’s Material Design Icons

FragmentQR

QR-link to text

FragmentQR

Developed by Yonah Aviv

Summary

Introduction