csfr Templating Issue

loversama

I am adapting a template currently and I am getting csfr errors when trying to use the template, its an adapted version of the "Slick" theme but don't see any references to csfr or where or were and why its getting called.. I have to switch templates to Persona to login then switch to the custom template I cannot login when that template is activated first.. halp xD

Thanks

PitaJ

What template is it? Do you mean theme?

loversama

Hey, yeah sorry its nodebb-theme-slick its a bootstrap theme which I've been adapting I have some JS errors which perhaps could be responsible for it (still looking into applying external scripts like jQuery plugins and such) but my main issue for now its logging in while I am reworking the visual side and getting a csfr error when trying to login on the adapted version.. I think its a JS issue but I am not sure where the csfr is getting called and what would be blocking or interrupting it..

Also my JS errors I think are messing with requireJS import process? I couldnt find much documentation on including external scripts so still looking into that too

julian

Might mean the login.tpl has been changed so that there are elements missing that are required. What errors do you see in client-side browser when you navigate to the login page?

loversama

Failed to load resource: net::ERR_FILE_NOT_FOUND

login:1 This page includes a password or credit card input in a non-secure context. 

A warning has been added to the URL bar. For more information, see https://goo.gl/zmWq3m.

bootstrap.min.js:6 Uncaught Error: Bootstrap dropdown require Popper.js (https://popper.js.org)
    at bootstrap.min.js:6
    at bootstrap.min.js:6
    at bootstrap.min.js:6

jquery.timeago.en.js:2 Uncaught TypeError: Cannot read property 'settings' of undefined
    at jquery.timeago.en.js:2

require.js:7 Uncaught Error: Mismatched anonymous define() module: function(){"use strict";function e(e){return e&&"[object Function]"==={}.toString.callreturn e.replace(/left|right|bottom|top/g,funrequire.js:7)
    at v (require.js:14)
    at require.js:26

jquery.js:3818 jQuery.Deferred exception: Cannot read property 'settings' of undefined TypeError: Cannot read property 'settings' of undefined
    at Object.overrides.overrideTimeago (/assets/nodebb.min.js?v=hmfs6mquup4:1:326538)
    at Object.app.load (/assets/nodebb.min.js?v=hmfs6mquup4:1:306356)
    at HTMLDocument.<anonymous> (/assets/nodebb.min.js?v=hmfs6mquup4:1:324732)
    at c (/assets/nodebb.min.js?v=hmfs6mquup4:1:33990)
    at u (/assets/nodebb.min.js?v=hmfs6mquup4:1:34318) undefined
x.Deferred.exceptionHook @ jquery.js:3818

jquery.js:3827 Uncaught TypeError: Cannot read property 'settings' of undefined
    at Object.overrides.overrideTimeago (overrides.js:117)
    at Object.app.load (app.js:41)
    at HTMLDocument.<anonymous> (ajaxify.js:432)
    at c (jquery.js:3534)
    at u (jquery.js:3602)

sockets.js:124 Uncaught TypeError: t.addClass(...).removeClass(...).tooltip is not a function
    at i.o (sockets.js:124)
    at i.emit (socket.io.js:6)
    at i.emit (socket.io.js:7)
    at i.emitAll (socket.io.js:6)
    at socket.io.js:6

** Had to remove urls & part of the large spam require error put in console

I think these errors are being caused due to trying to include normal js files that rely on jQuery? but will the interruption of client side js cause a csfr issue? I am planning on looking into sorting the JS but trying to understand whats happening.. I haven't yet changed the login.tpl yet (header/nav maybe yeah but not removed any of the main head)

julian

Can you show us your theme's theme.json and plugin.json?

loversama

@julian

{
	"id": "nodebb-theme-sinfulshadows",
	"library": "./lib/theme.js",
	"hooks": [{
			"hook": "static:app.load",
			"method": "init"
		},
		{
			"hook": "filter:admin.header.build",
			"method": "addAdminNavigation"
		},
		{
			"hook": "filter:config.get",
			"method": "getThemeConfig"
		},
		{
			"hook": "filter:topic.build",
			"method": "addUserToTopic"
		},
		{
			"hook": "filter:user.customSettings",
			"method": "customSettings"
		},
		{
			"hook": "action:user.saveSettings",
			"method": "saveSettings"
		},
		{
			"hook": "filter:user.getSettings",
			"method": "getSettings"
		},
		{
			"hook": "filter:meta.getLinkTags",
			"method": "getLinkTags"
		}
	],
	"scripts": [
		"lib/sinfulshadows.js",
		"lib/modules/slideout.min.js",
		"lib/modules/bootstrap.min.js",
		"lib/modules/dataTables.bootstrap4.min.js",
                "lib/modules/jquery-3.2.1.min.js",
		"lib/modules/jquery.countdown.min.js",
		"lib/modules/jquery.dataTables.min.js",
		"lib/modules/jquery.easypiechart.min.js",
		"lib/modules/jquery.mb.YTPlayer.min.js",
		"lib/modules/jquery.sticky.js",
		"lib/modules/lightbox.js",
		"lib/modules/morris.min.js",
		"lib/modules/notification.js",
		"lib/modules/owl.carousel.min.js",
		"lib/modules/popper.min.js",
		"lib/modules/prettify.js",
		"lib/modules/raphael-2.1.0.min.js",
		"lib/modules/select2.full.min.js",
		"lib/modules/select2.min.js",
		"lib/modules/summernote-bs4.js",
		"lib/modules/switchery.min.js",
		"lib/modules/core.js",
		"lib/chats.js",
		"lib/quickreply.js"
	],
	"acpScripts": [
		"lib/admin.js"
	],
	"templates": "./templates"
}

I had actually fixed this, I did this by just removing most the custom JS scripts I was trying to load... the JS not loading when require.js tries to load it is the reason that template brings up a CSFR issue, its obviously erroring some JS that is required to send the data correctly?

Either way I knew that removing all the JS would resolve it, but was interested in exactly what error and what in the main themes is responsible for making sure csfr is right.

(Also I read about jQuery not being able to be included twice? also need to see how templates treat jQuery plugins and how to link them without an issue)