cancel
Showing results for 
Search instead for 
Did you mean: 
samuel_malcolm
Community Participant

Only mobile custom JS and CSS returned via API?

Jump to solution

Im trying to get the custom files uploaded to the theme editor accross a canvas environment using a script. Its written in node using JS dom to parse and process the response. The problem is that the API only returns the mobile versions of the uploaded JS and CSS files in the response, even when others exist. Is there a way in the request to tell it to return the main versions? or both? Has anyone else had this issue?

Labels (1)
Tags (3)
1 Solution

Accepted Solutions
James
Community Champion

I responded to the Can I upload theme CSS and JS using an API?  thread before I found this one, sorry. It's probably better in it's own thread, so I'll duplicate the relevant portions of the post here:

What I was thinking is that you might be able to do this:

  1. Use Node / JSDom to log into the Canvas web ui as a headless browser. There are other ways to do this -- I think puppeteer is one way, but I don't know how to use it, so I'm sharing what I have experimented with.
  2. Get a list of subaccounts from the API
  3. For each subAccount, visit the theme page within Canvas that Canvas subaccount: example /accounts/123/brand_configs
  4. Obtain the ENV variable. This is where I would use JSDom to extract information from the window variable or you could parse the HTML delivered and bypass it -- probably quicker, but possibly harder to use. There is an ENV.brandConfigStuff object. It's pretty big, but it has a lot of information in it, including everything that I think you're after.
  5. Grab what you need and do something useful with it.
  6. Loop back to step 3 for the next subaccount.

 

Here is some of what is inside ENV.brandConfigStuff:

  • baseBrandableVariables contains the colors and log / header locations.
  • brandableVariableDefaults is probably not what you're after here, but you may need to use it in conjunction with something else.
  • accountID but you already knew this to get the information
  • sharedBrandConfigs is an array of all the configs that you might be able to use for this subaccount themes. It includes the name and brand_config_md5, parent_md5, variables, js_overrides, css_overridesmobile_js_overrides, and mobile_css_overrides. Those last four are null when there are no overrides. When there is an override, it has the URL to the override. Those files are wide open, so you can fetch them without having to be logged into Canvas. The variables contains only the overrides from the defaults.
  • activeBrandConfig is the one you probably want. It has the same information as sharedBrandConfigs, especially the JS and CSS overrides, except that if your brand config is shared, there are no variables here. Strangely, my name here is null. You can, however, use the md5 property and then search the sharedBrandConfigs to get additional information from there, including the name.

View solution in original post

2 Replies
James
Community Champion

I responded to the Can I upload theme CSS and JS using an API?  thread before I found this one, sorry. It's probably better in it's own thread, so I'll duplicate the relevant portions of the post here:

What I was thinking is that you might be able to do this:

  1. Use Node / JSDom to log into the Canvas web ui as a headless browser. There are other ways to do this -- I think puppeteer is one way, but I don't know how to use it, so I'm sharing what I have experimented with.
  2. Get a list of subaccounts from the API
  3. For each subAccount, visit the theme page within Canvas that Canvas subaccount: example /accounts/123/brand_configs
  4. Obtain the ENV variable. This is where I would use JSDom to extract information from the window variable or you could parse the HTML delivered and bypass it -- probably quicker, but possibly harder to use. There is an ENV.brandConfigStuff object. It's pretty big, but it has a lot of information in it, including everything that I think you're after.
  5. Grab what you need and do something useful with it.
  6. Loop back to step 3 for the next subaccount.

 

Here is some of what is inside ENV.brandConfigStuff:

  • baseBrandableVariables contains the colors and log / header locations.
  • brandableVariableDefaults is probably not what you're after here, but you may need to use it in conjunction with something else.
  • accountID but you already knew this to get the information
  • sharedBrandConfigs is an array of all the configs that you might be able to use for this subaccount themes. It includes the name and brand_config_md5, parent_md5, variables, js_overrides, css_overridesmobile_js_overrides, and mobile_css_overrides. Those last four are null when there are no overrides. When there is an override, it has the URL to the override. Those files are wide open, so you can fetch them without having to be logged into Canvas. The variables contains only the overrides from the defaults.
  • activeBrandConfig is the one you probably want. It has the same information as sharedBrandConfigs, especially the JS and CSS overrides, except that if your brand config is shared, there are no variables here. Strangely, my name here is null. You can, however, use the md5 property and then search the sharedBrandConfigs to get additional information from there, including the name.

View solution in original post

samuel_malcolm
Community Participant

Thanks James, Good idea using the headless browser. JSDom didnt seem to parse the javascript in a way to add ENV to the window object, but i was able to retrieve it with `JSON.parse` and a regular expression. I ended up using Selenium as i know that other parts of our institution use Selenium for this kind of thing so i figured best to use the oppertunity to get familiar with it. Its a slow process, but its not a job i need to run often so thats perfectly ok