Home > Software design >  Displaying a different svg image in a GitHub README depending on the branch
Displaying a different svg image in a GitHub README depending on the branch

Time:12-18

Is it possible to display a different .svg image/content in a GitHub readme, depending on which branch is used to view the readme in a browser?

In essence, can one do something like:

if current_path=main then:
   display main.svg
elif current_path=other_branch then:
   display other_branch.svg
end

in the readme.md?

Such that if one goes to: https://www.github.com/some_user/some_repo/tree/interactive it displays another .svg file than when one goes to: https://www.github.com/some_user/some_repo/tree/non-interactive. (Whilst still not yielding a merge conflict (nor destroying the option to display the right image in the right branch) if a pull request is merged from branch interactive into branch non-interactive).

CodePudding user response:

The only way to do this would be to have different versions of the README on different branches, each pointing to their own SVG. However, that would result in one version overwriting the other if you did a pull request from one branch to the other, which you said you didn't want.

The reason is that GitHub doesn't offer the ability to execute JavaScript or other code as part of rendering an README or other text document. Since such code would run in the same security context as the rest of GitHub, doing so would be a security vulnerability.

It is theoretically possible you could try to serve different versions of the SVG from the same URL from a server based on the Referer [sic] header, but I'm pretty sure since GitHub proxies all images through its image proxy, Camo, that your server will never get a Referer header and that won't work.

In general, GitHub's README and other text document rendering is intended to simple, predictable, and totally not customizable in any way. Customization tends to come with security, accessibility, readability, and aesthetic concerns, none of which GitHub is looking for in this context.

  • Related