Script injecting to Glitch Editor

Glitch Help
1

I’m attempting to make a Glitch “extension”. This idea popped out after seeing Lameplit’s extensions. I browsed some, and I thought my idea would be a .CSV viewer. Now, this isn’t a suggestion to turn .CSV files into something like the graphical .ENV viewer embedded in the editor itself, because my hard work would all go to code-hell. And I’m also not the 18969th wimp to ask for an official extension API for Glitch, this isn’t a suggestion.

But why am I bringing this up? You see, I planned COOLcsv (uncool name, I know (get it?)) to work as a simple bookmarklet that injects the required JS code. I thought simply importing it would work, it didn’t. Then after a “few” tries I realized the Github API is allowed to request through Glitch (likely the Glitch-Github support), so I created a private Github gist for the code of COOLcsv, requested it, worked fine, until I realized Glitch blocks any kind of injection possible, whether it’d be though an eval/new Function, <script> inlines and tags with a src to a data URL, so on.

Though yes, Github API can give us a raw link for my beautiful script of the gist (I tested the extension more than I tested the injecting bookmarklet itself, how smart /sarc), but requests to rawgithubcontent.com are blocked either, because, of course, don’t let unnecessary URLs be requested or else abominations like COOLcsv are easy to inject or manipulate the editor itself.

I also tried removing the <meta> tags which correspond to the CSP, but some of the CSP was still left, leaving me absolutely insane, yet again with my stupid code creations that never should and will work.

Looks like this is a dead end, cause I don’t think anyone would contact me for the sole purpose of telling how to hack into Glitch’s editor, so I don’t ask for any help, rather, I’m hoping I discover some sort of hole in Glitch’s highly inspected CSP string or something like that, but again, I’d be banned for inserting ugly Rix code onto Glitch editor (trust me, my code style is ugly).

:pensive:

2 Likes
2

Also, I do know the prime existence of user scripts, but you have to install some sort of extension before using user scripts. Yes, I don’t use Firefox.

1 Like
3

If you’re using a Chrome-based browser, you could try taking a look at my extension that I have been working on.

It all some pretty terrible code that need refactoring, but it’s doing nearly the same things you’re wanting, so it should be helpful.

4

Yeah sure, until people that use a non-Chromium browser like IE show up, though this is a great idea :slightly_smiling_face:

1 Like
5

This will likely be the one solution that’ll actually work

1 Like
6

I’m trying to figure out Firefox support to, but it’s met with some complications.

7

No no, I don’t use Firefox, cause I use C̷̢̛̛̛̛̯͚̲̬̩̳̝̹̙̖̳̠̝̠̠̗̜̻̱͙̳̭͖̤̋̌̾̆͑̃̐͑́͑̾́̆́̒̊̈́͑̂̾̈́͐̈̆̀̈̉̑̋͆̎̊͛͗̿͋̈̇̈̚̕͘̚͜͝͝͠h̷̡̡̧̡̡̛̛̩̹͙̣͚̘̫̳͔͖̰̪͎̝͈̘͍̰̩͉̻͙̹̞̜̼̻͈̫̩̝̻̮̺̭͙̥͈͎̯̮͆̎͊͒̃͑͊́̑̐̀͛̏̈́̔̐̑̓̈́̊̒͋̄̃́̀͊̐̈̈́̔̆͂̈́́͐̕̚͘͘͘͜͜͜͝ͅr̸̡̜̮̜̙̻̲̣̜̺̞̱̰͚̳͉͚̘͙̼̟̯̲̹̞̫̘̺͙̜̠̺̝̩̬̭̰̖͍̟̝̲͕͎̱̈́̏̅̐̍̇̊̿̐̀̉̔̈́́̃̔̋̄̓̍̈͂̓̓͊̾̾́̄̓̉̆̀͊̀̀̇̇͆̈́̾̇͛͆̚̚͜͠͝ͅͅͅơ̵̡̘̼̘̪͚͇̟͚͔̯͓̥̙̜͕͈̥̼̫̙̟̤̪͕͋͂̎͑́́̍̆͐̀̔̓̏͊̀̀̋͑́̆̚m̸̡̡̧͉̣̙̲̗͚̬̳̯̥̭̮̗̫̘͙͈͈̲̲̝̬̳̘͓̻͙̼̖̩͖̠̻̤̯̻͚̾̀̈̒̈́͛͊͊̾̔̀́́̐͌̎̿̓͗̇͛̈́̋̋̉̒̾͊̇͒̎̃̑̐͊̐̔̄͒̏̒̕̕͘͜͜͜͠͠͝͝͝ͅͅͅę̴͕̻͖͔̻̪̟̜̲͙̥̩͉̖͍̜̩͊̉͋̿̏͐͆̅̀̑̍̃̉̀̊͒̂̌̈́͊̆̇̽͗͑̏̕͠ͅ

2 Likes
8

could you upload the script to npm and request it through unpkg.com

9

A new ridiculous solution I’ve been using recently is putting the code in the readme of a project and then requesting it using glitch’s project api README endpoint, that is allowed using cors.

Or just upload it to npm and use unpkg

1 Like
10

But if you can read files, why not read something else than the README? Or is the special endpoint only for READMEs? Plus, eval doesn’t work if it’s not from DevTools

11

Also, UNPKG seems like a perfect solution, why haven’t thought of that before? /srs

12

I will check out UNPKG and NPM tomorrow. Brilliant idea for a bookmarklet, doesn’t even request to Github API. :smile:

13

oh boy if you’re worried about IE support, you’re gonna be here for a long time!

14

Why not put whatever stuff you want to load from raw.githubusercontent.com into a Glitch project? Upload all your files into a Glitch project (without any package.json or anything) and Glitch will serve them normally!

15

You know, there still are apps that use IE. And plus, IE can still be triggered by a simple .VBS scriptoe.

1 Like
16

Only support-poster.glitch.me are CSP-compliant for Glitch. You can’t request other glitch.me domains without a CSP restriction error.

1 Like
17

Of course, that is, if you decide to uninstall Edge like I did

1 Like
18

even if someone comes up with a way to get through the CSP, I don’t think posting here would be a good idea because it’s basically a security vulnerability on glitch’s side of things :sob:

19

That’s why I wasn’t needing help, but a miracle (a way to request the JS to Glitch)

1 Like
20

UNPKG worked perfectly fine. :3

2 Likes
21

It’s a special endpoint only for the readme.

22

IE is deprecated and super old, forget it. Edge is based on chromium so you provabily won’t have to worry about it.

23

You know what they say, “just because it’s deprecated, doesn’t mean nobody uses it for another 10 years”

24

Eh, UNPKG looks like a better solution anyway.

25

offtopic tip: If you’re making an extension for glitch I highly recommend checking out the application variable, it has a ton of cool hidden stuff and it’s what I’m using to build the new glitch chat extension.

1 Like
26

I don’t think glitch itself is supported in IE, but anyways no one should be using it - even if there is anyone using it, it’s a very small percentage that provabily won’t be using glitch.

27

offtopic message for the offtopic tip #1: Yeah, I saw application from @Haizlbliek’s extension. I thought that application being a long name was defined somewhere in the extension itself with cool functions. Didn’t find any other refs other than the extension code itself; turns out that the Glitch editor itself includes the application. I wonder why even make global variables when almost nothing else other than DevTools are able to even access it, not even talking about CSP

message #2: GLICTH CHAT???/??1??

1 Like
28

Yeah that’s what I’ve been using, but the README api endpoint is still pretty interesting

29

I’m working on bringing back this: [ARCHIVED] 💬 Open source glitch chat

30

Probably used within Glitch. You know what they say, “dog-fooding” (a code practice to code something for likely only you to use)

1 Like
31

*woah.wav*

2 Likes
32

When looking at the glitch editor code I noticed a lot of stuff that should have been removed after the editor redesign but still continues there, kind like Microsoft Windows lol. A lot of stuff there seems unused or old.

33

I remember you can spawn dialogs (the what’s new dog), but my only source to test dialogs (the dawg) is gone :sob:

1 Like
34

Like the fact when you press back on any of Glitch’s built in tools (except Rewind, that uses different UI like logs and Terminal) it shows you a weirder Tools popup that’s obviously waay older than the regular one. I mean, it’s still styled like it came out this year, but still

1 Like
35

fun fact: The Dialer from 3.1 is still available in 11, just run dialer. I mean, it kind of makes sense because all that backwards compatibility, but at least update the UI of that 9X app, Microsoft

1 Like
36

I imagined Windows 11 as a wayy better version than what it is, given those four 2D squares for the new logo (it sucks ngl, Microsoft but #0080ff)

1 Like
37

What have you been using to spaw dialogs? The only way I’ve discovered is just adding them to the html taking advantage that most of the old css classes still work lol

38

Yea that was the old, pre-redesign version of the “tools” popup

39

There was a “what’s new” message below the navbar (somewhat like the “Fastly invitation” message) telling Glitch “got new features” and when you click on a button, it showed up the “new features” in some sort of popup (shows features from around 2 yrs. ago I think(?))

1 Like
40

Also, goddamn it, my URL parsing to get the current file was useless because application.currentFileInfo exists and even shows the extension but as long as it doesn’t return current line and line character with the info, that’s a kind of a win for my parsing, so I will keep parsing

1 Like
41

Choosing “embed project” in settings also spawns a popup

But I don’t know how to replicate opening a dialog on itself

1 Like
42

I use rectify11 so it’s much better, highly recommend

43

I think it’s still there

44

I use 10, because that’s the system my PC came with instead of 11 for some reason

1 Like
45

Yeah I just append it to the HTML

46

I captured some HTML of the dialog (edited to be placeholder), but adding equivalent event listeners gon be a troublin for me

<div class="overlay-background"><dialog class="overlay share-embed-overlay"><section class="info"><h1>title?</h1></section><section class="section-wrapper">content??</section></dialog></div>

EDIT: you put this in div#application as the latest element (I don’t think order is necessary for the popup)

1 Like
47

I’ll check that out if it looks better than my current solution, thanks!

48

With enough code, I spawned… A SAMPLE POPUP THAT DOESN’T CLOSE ON CLICK OF THE BACKGROUND!!

1341×480 20.9 KB

2 Likes
49

So far, I can only see application.files()[application.currentFileInfo().path].I.content as the only way to read the current file, or take data from the editor’s CodeMirror (I don’t know if that is accessible)

EDIT: I am completely wrong. :neutral_face:

50

Reading the current file from the CodeMirror editor object is by doing application.editor().getValue().

2 Likes
51

You can make it close by adding an event listener to the body that checks if the click target is the modal. If it isn’t, the remote the modal element

52

Can I join the project? I would love to help making coolCSV :slight_smile:

53

I wonder if collabbing on NPM is even possible (97% of the extension’s on NPM, also it’s COOLcsv, I keep forgetting the casing too)

1 Like
54

Yeah, my brain is braining, trust me.

1 Like
55

Do you use github/glitch for hosting the npm library or is it just your computer?

56

I’d love to help too, if possible.

57

Yeah, it’s local for now, but I could make an “organization” for COOLcsv and a private repo for the source code and maybe invite you guys <3

1 Like
59

Might not be helpful but I found when making my own extension chrome-extension:// URLs bypass CSP completely. At least injected from an extension.

2 Likes
60

oh yeah, back in the day before you could tell chrome to run a script in the page’s “world,” there was a technique where you use DOM to insert a <script> element of a .js file from your extension, something like that

1 Like
62

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.