andrei-markeev / cisar

SharePoint CSR Live Editor (Chrome extension)

Cisar

Google Chrome browser extension that adds a tab to Developer Tools, where you can create SharePoint Client Side Rendering customizations and they will be applied as-you-type to the underlying page.

Installing

Extension is available on Chrome WebStore.

Alternatively, you can install it manually from the source code:

1. Download the source code archive from GitHub and unpack it to some folder
2. Check the "Developer mode" checkbox on the extensions page
3. Click [Load unpacked extension...] button
4. Select folder with the Cisar source code

Using

1. Navigate to your SharePoint portal, to the page where you have list view or list form or search results webpart that you want to customize.
2. Open Developer Tools window (F12).
3. Switch to "Cisar" tab
4. Either create a new file or select existing one in the left side panel
5. Start writing customizations

Roadmap

1. Add support for creating Display Templates and attaching them to webparts

cisar's Issues

Personal Views not recognized

When creating a new PERSONAL View based on an existing View (with CSR)
Cisar errors:

Error when retrieving properties for the CSR webparts on the page: Specified argument was out of the range of valid values.

Allow a JS-Link to: ~/site/...

Hi, I do have a question related to CISAR. Within the extension there is the possibility to change the path. I am trying to set the path so the JS-Link property would be set to something like: ~site/SiteAssets/

Is that possible?

Calendar views and forms

Notify users that calendar views and forms aren't supported by CSR.

Delay on save/execute

Loving Cisar.. best thing since sliced bread

With serious editting the constant saving (on every keypress) can cause some issues;
maybe a delay .. saving 500 miliseconds after the last keypress .. can help
This might also prevent the need for having to type a space to update the code?

I am now used to start a line with // (comments) and then type the complete code in that line, then removing the comments.
I presume that is why you added the Ctrl-K shortcut I spotted in the source code.

Cisar does not show in Developer Tools

I tried both the Store install and the manual install, but Cisar does not show in the Developer Tools.

Trying to install again from the Store gives me the error: This item is already being downloaded and added into Chrome.
Corresponding error in console:

I can select Reload, but nothing really happens

There is no Cisar in: chrome://extensions/

if you need any more info let me know

TNX!

No CSR enabled WebParts found on this page

I haven't used Cisar for a week or 3

Now get:

Since its Cisar 1.3 from february, I presume something changed on Office365

File is saved even if nothing is changed

Every time file is loaded into the edit box, it is autosaved. Autosave should happen only when file is changed.

Using ~site option gives an error when creating a file

Cisar fatal error when saving file testfile.js to path "/sites/xxx/yyy/mysubsite/siteassets/javascript": Datei nicht gefunden.

The file got created but is empty.

No CSR-enabled webparts found on the page

Hello!
I've trying to simply customize list view via JSLink. Its not working! I activated/deactivate the MDS feature and always the same thing, not working!
To call the jslink script on the webpart, I've linked to: ~site/siteassets/subject_template.js or ~sitecollection/siteassets/subject_template.js
I installed the Cisar Chrome Extension (trying install from google and zip-archive .) - but it's not working!
F12 on view, forms -> Cisar -> "No CSR-enabled webparts found on the page"

I've seen discussion here "#21" but but nothing helped.
What requirements on SP2013 on-premise must be met for Cisar? (production server:MDF is on, test server: MDF is off)
I checked on the production and on the test server - the same result.

Unfortunately the problem is possible in the SP2013, but visually it works, except JSLink or CSR.

Thank you in advance.

SharePoint JSLink file create/update operations do not work properly when not root site collection

Hey,

Like the title says, the error occurs while trying to create/update JSLink file when site collection uses managed path.
Potentially the issue is related with the method SP.Web.getFolderByServerRelativeUrl, it seems path variable does not take into account site relative url in SPActions.getCode_createFileInSharePoint method since it's value comes from FilesList.filespath property as '/Style Library/':

var files = context.get_site().get_rootWeb().getFolderByServerRelativeUrl(path).get_files();

After applying the following fix:
var files = context.get_site().get_rootWeb().getFolderByServerRelativeUrl(_spPageContextInfo.siteServerRelativeUrl + path).get_files();

the file could be saved/updated properly.

Best regards,
Vadim the Great!

Can't create CSR files in subsites

I can use Style Library and other document libraries is the Root site, but can not change path to Subsites

Doesn`t work in document library sponline

Tool throws error:

TypeError: Cannot read property 'childNodes' of undefined(…)

in

for (var f in ctx.ListSchema) {
if (f == "Attachments" || f == "Created" || f == "Modified" || f == "Author" || f == "Editor")
continue;
var nodesToReplace = [];
for (var n = 0; n < rows[i].childNodes.length; n++)

because ctx.ListSchema contains all the fields including Modefied and Author which aren`t present in rows collection. So in my case, ListSchema containes 10 items but rows, which are formcontrols, contain just 6 items.

Search in Cisar code

Please add a feature to search within Cisar. Currently, if you're writing a lot of code and you need to make changes somewhere, it becomes difficult to find that.

P.S.: Thanks a lot for making a tool like this. Makes editing CSR a breeze!

Reference to (original) URL where the CSR file was used in a (first) JSlink connection

While testing I have created multiple CSR files (in the default /Style Library/) on multiple sites.
I now do not know in which sites I used which CSRfiles.

Suggested feature: When the Cisar file is created add a comment section displaying the URL(s) where the file was JSlinked
eg:
/*
Created on:
JSLinks:
https://365csi.sharepoint.com/sites/VM/Lists/Tasks/AllItems.aspx
https://365csi.sharepoint.com/sites/Demo/Lists/Tasks/MyItems.aspx
/JSLinks
*/

Error when editing page

Publishing page on second-level site with ListView view web part on it. Error when trying to create new file.

Cisar fatal error when creating file view.main.js at /style library/: Файл не извлечен. Для внесения изменений необходимо сначала извлечь этот документ.

File was created, but it's empty.

Double forward slashes '//' causes parsing error Unexpected identifier

You can not use:

var a='//';

It causes an Unexpected Identifier error

Workaround is to write it as:

var a='/'+'/';

Not working on Chrome for Mac

It can successfully use CISAR on Chrome for Windows. But unfortunately, I lately switch to a MacBook Pro and I can not get CISAR to work on Chrome for Mac.
When I open the extension from any SharePoint site in the devtool - the panel on the left side keep showing an animated loading icon indefinitely.
Any help ?

Reload opens the last Published version, not the last minor version

If you do not Publish (with a click on the green checkmark) and close the browser,
next time Cisar will reload with last Published version and make that the (overwritten) minor version.

Workaround is

• close F12 developer tools
• checkout the file in the style Library
• check the Version history for the last version nyou editted
• restore it
• Check file in
• open F12/Cisar again

Multiple JSLink references to the same file

Often Cisar does not pick up the JSLinks settings on the current page;
if I then add a new Cisar file it correctly links to the existing file.. but ADDS the link to the JSLink field.. causing a lot of double links:

https://icsr.github.io/JSLinkManager.html

Note: On SharePoint Online it is valid to reference external files with JSLink, would be nice if Cisar excluded those as Cisar says they are 404 when clicked

JSlink remains on WebPart when the CSR file is deleted manually from the Style Library

I had to delete the file manually from the Style Library because the code ran into an endless loop.
When I reopened Cisar on the View page it looked up the file (from JSlink in the WebPart) which returns 404 code in the Cisar editor
Now the editor doesn't save any new code added in the Cisar editor
Only way to resolve is to manually delete the JSlink from the webpart (or recreate the file in the Style Library)

Suggested feature: When Cisar detects a 404, ask the user if the JSlink should be removed OR the file should be recreated.

[question] Why do I get "No CSR-enabled webparts found on the page"?

awesome tool! I'm getting this error in default forms. MDS is off.
thank you in advance.
-egidio @egidiocs