Developer

Cleaner code with CFML formatter (VSCode extension) + cfformat (CommandBox module)

by

I don’t work on a lot of non-CFML development but I had a couple of PHP projects and a JavaScript project I was working on last month. In an effort to tidy up my code in those projects I started using Prettier. I even wrote a post on Prettier and how I would be including it in future projects. Well, this weekend I was working on a CFML project and came across Mark Drew’s incredible CFML formatter extension for Visual Studio Code. Per the documentation:

CFML formatter is a Visual Studio Code extension that provides formatting for CFML files using Lucee Server and CFFormat

CFML formatter and cfformat are two great tools you can use to:

  1. Set and implement coding standards for yourself and/or your team.
  2. Format code in real time as you work in Visual Studio Code.
  3. Scan, review, and even format code issues manually or in an automated manner by watching directories.

Installation

CFML formatter

Install the CFML formatter VSCode extension from the Extensions view in Visual Studio Code.

cfformat

Install the cfformat CommandBox module by launching CommandBox and running the following command.

box install commandbox-cfformat

A few things you can do with CFML formatter

Format code on save

This will format your code using CFML formatter every time you save a file in Visual Studio Code (you can define the rules using a .cfformat.json file which you can also share with your team!).

To configure Format code on save:

  • Open Settings by pressing Cmd+, for Mac (or CTRL+, for Windows/Linux).
  • Type format in the search box and enable the option Format On Save.
Format on save in VSCode
Format on save in VSCode

Format code using right click

This will format your code using CFML formatter when you right click in the Visual Studio Code editor and choose Format Document

More info on CFML formatter

You should also check out CFRules.

Read the full CFML formatter documentation at Visual Studio Marketplace.

A few things you can do with cfformat

Run a wizard

cfformat settings wizard

The wizard will:

  1. Walk you through all settings.
  2. Display the options AND what those options will do to an example of code.
  3. Indicate the default setting.
  4. Generate a .cfformat.json file for you based on your choices.

This wizard option is incredible!

View existing settings

cfformat settings show

cfformat settings show command in CommandBox
cfformat settings show command in CommandBox

These settings can be stored in a .cfformat.json file in your Visual Studio Code project. They will then govern Format code on save and the Format Document on right click action.

Read the full settings reference at: https://github.com/jcberquist/commandbox-cfformat/blob/master/reference.md.

Learn more about a setting

cfformat settings info tab_indent

cfformat settings show info command in CommandBox
cfformat settings show info command in CommandBox

Checking Tag structure

This option looks for:

tags that are unbalanced or incorrectly structured

Check a file:

cfformat tag-check about.cfm

cfformat tag-check file command in CommandBox
cfformat tag-check file command in CommandBox

Check a directory:

cfformat tag-check

cfformat tag-check command in CommandBox
cfformat tag-check command in CommandBox

Not only will cfformat tag-check locate cfml tag issues it will also locate html tag issues as shown above!

More info on cfformat

Check out some other really cool stuff like Watching Directories and Ignoring Code Sections.

Read the full cfformat documentation at FORGEBOX.

In Summary

My workflow is going to be:

  1. Generate a .cfformat.json file in my CFML project using the cfformat CommandBox module
  2. Let CFML formatter format my code on save in Visual Studio Code (governed by the .cfformat.json file)
  3. Periodically I will manually run cfformat tag-check on my project using the cfformat CommandBox module.

Prettier with a sample .prettierrc and explanation of options

by
A cute and smart dog wearing glasses
A dog with glasses ready to do new tricks

I’ve worked on a team of one for a very long time. I appreciate the level of autonomy that I have, but I’ve noticed now more than ever that it can facilitate bad habits and laziness. Luckily, in the modern era of coding there are tools that can help encourage (or flat out enforce) good habits in code formatting and style. My latest attempt to start cleaning up some bad habits is to use Prettier (an opinionated code formatter) in all my projects rather than selectively.

Rather than me going deep into the how and the why for using Prettier I’d recommend reading this explanation.

If you use VSCode like I do then you first need to install the Prettier extension.  Once you have done that you can try out the sample .prettierrc file below by placing it in the root of your project(s).  The .prettierrc file is the configuration file that will allow you to set the Prettier options in a way that makes sense for your project. I’m trying to mostly use defaults (i.e. good habits), but there are a few options I prefer, or they are so engrained in legacy code that I maintain that changing them would be a Herculean effort.

Once the .prettierrc file is in place…

To format a document in VSCode:

  1. Use a Shortcut:
    • Windows/Linux: Press Shift + Alt + F
    • Mac: Press Shift + Option + F
  2. Use the Command Palette:
    • Open the Command Palette with Ctrl + Shift + P (Windows/Linux) or Cmd + Shift + P (Mac).
    • Type "Format Document" and press Enter.
  3. Auto-format on Save (optional):
    • Go to Settings (Ctrl + , or Cmd + ,), search for "format on save", and enable it by checking Editor: Format On Save.

Below is a gist containing two files. The first file is the sample .prettierrc.  The second file is a README which actually includes the contents of the .prettierrc file and explains the options.

The gist:

You don’t have to use a .prettierrc file. You can set up your options directly in the Prettier extension’s settings. However, I’m using the .prettierrc file so it is clear what options are being enforced on any given project.

ckEditor, jQuery Validation Plugin, Bootstrap 5 Implementation

by

I recently had a project at work with a very specific desired front-end stack and functional requirements. After building out the project I came up with a demo to show how I was able to put it all together.

This demo implements multiple instances of ckEditor in conjunction with the jQuery Validation Plugin and Bootstrap 5. There are commented out settings to implement ckEditor’s subscription version.

See the Pen ckEditor-jQuery-Validation-Plugin-Bootstrap-5-Implementation by Chris Simmons (@csimmons_dev) on CodePen.

ColdFusion Scheduled Tasks Failing with 403 Forbidden Error (Cloudflare Issue)

by

My company recently experienced an issue where all of the scheduled tasks in CFADMIN were failing. The first step I took to troubleshoot the issue was to check the scheduler.log log file. Each task had 2 lines in the log file. The first line indicated that the task had been triggered. The second line indicated an error of 403 Forbidden.

"Information","DefaultQuartzScheduler_Worker-3","11/08/24","07:00:00","","Task DEFAULT.NIGHTLY CLEANUP JOB triggered."
"Error","DefaultQuartzScheduler_Worker-3","11/08/24","07:00:00","","403 Forbidden"

Since no permissions had been changed on the server this was a perplexing error. The next step that I took was to execute one of the task URLs from a web browser on the sever. The task completed successfully. This led me to try to obtain more information about CFADMIN running the task so I enabled Save output to file under the Publish section of the Scheduled Task and specified a file to output the result.

CFADMIN Scheduled Task Log to File
CFADMIN Scheduled Task Log to File

Once this setting was in place I executed the task again from CFADMIN > Server Settings > Scheduled Tasks and checked the log file. The log file contained the text error code: 1010.

CFADMIN Scheduled Task Log to File result
CFADMIN Scheduled Task Log to File result

Researching error code: 1010 led me to several articles regarding Cloudfare blocking access to a site based on the browser signature.

This narrowed the issue to either an issue with Cloudfare or the task not running correctly when executed by ColdFusion. I decided to try execute the URL from a ColdFusion cfhttp call using the following basic script.

The task completed successfully when called from cfhttp. Below is a dump of the result:

Dump of cfhttp
Dump of cfhttp

The issue therefore seemed to be narrowed to the fact that Cloudfare was rejecting calls to URLs from the CFADMIN (apparently based on an issue with the browser signature). The browser signature is examined at Cloudfare by a Browser Integrity Check (BIC) as a component of a WAF.

A WAF or web application firewall helps protect web applications by filtering and monitoring HTTP traffic between a web application and the Internet. It typically protects web applications from attacks such as cross-site forgery, cross-site-scripting (XSS), file inclusion, and SQL injection, among others.

Read more about Cloudfare’s WAF.

You can create a custom WAF rule to turn off the Browser Integrity Check (BIC). First, use the Go to navigation to search for WAF and choose Security | WAF | Custom Rules:

WAF Go to
WAF Go to

Next, click the Create rule button to begin. Our solution will use the following settings to disable the BIC on requests only from our server IP to scripts residing in a certain directory:

  • For the `Field` select `IP Source Address`, for `Operator` select `equals` and enter the IP address of your server as the `Value` (this will allow the rule to only apply to requests from your server).
  • Click the `And` button to add another row.
  • For the `Field` select `URI Path`, for `Operator` select `wildcard` and and enter the directory of your scheduled tasks as the `Value` (this will allow a single rule to apply to multiple task scripts in the directory). Notice the directory uses a wildcard at the end `/jobs/*`.
  • For the `Choose action` select `skip`.
  • Select `On` for `Log matching requests`.
  • Under `WAF components to skip` check `Browser Integrity Check` (you may need to click the `More components to skip` link to locate it).
  • Click the `Deploy` button to enable the rule immediately.
WAF Create rule
WAF Create rule

You can view the logging of the Firewall events. First, use the Go to navigation to search for Events and choose Security | Events:

Events Go to
Events Go to

As you can see the previously blocked requests via CFADMIN are now allowed at Cloudfare via a Skip action using Custom rules.

Firewall events
Firewall events

ColdFusion unscoped variables and how to find them (using the new patch)

by

On March 12, 2024 ColdFusion (2021 release) Update 13 introduced a change with significant implications for developers, particularly for developers managing older code that could be “leveraging” a “feature” of ColdFusion whereby ColdFusion would forgivingly “search” through scopes in a specific order if a variable name is not prefixed with a scope identifier.

Rather than re-explain all the details here, Pete Freitag has a great write-up of the unscoped variable issue.

The release notes for the update also contain a section titled Significant changes in the release which details the issue and provides 2 options for “fixing” the issue.

Option 1: Correct application code to fetch values from the correct scope.

This option is obviously the ideal one, but how do you locate the offending code? If you are fortunate enough to use Fixinator there is an option to scan for the issue. See this post for how to use Fixinator.

If you don’t have Fixinator you can implement Option 2 and then use the new patch provided by Adobe to help find issues.

Option 2: Set searchimplicitscopes value back to TRUE.

This can be accomplished by doing the following:

  • Add the newly introduced flag, -Dcoldfusion.searchimplicitscopes=true to the jvm arguments
  • Set searchimplicitscopes key to TRUE in Application.cfc or Application.cfm to override the jvm flag set at the server level: this.searchimplicitscopes = true

Using the patch to find issues

Once you have Option 2 in place Adobe introduced a patch on April 1, 2024 to allow developers to view unscoped variables in a log file.

Link to the patch: https://helpx.adobe.com/coldfusion/kb/view-unscoped-variables-log-file.html

How to apply the patch

  1. Copy the patch to cfusion/lib/updates.
  2. Restart ColdFusion.

Once I had the patch in place I went to my application and just started using it. Within the first view pages the log file had entries.

How to view the log file

Navigate to the /cfusion/logs and locate the log file: unscoped.log. The unscoped variable is appended to the template name as :VARIABLENAME


"Severity","ThreadID","Date","Time","Application","Message"
"Information","XNIO-1 task-2","04/09/24","09:32:12","applicationName","/pathToApp/render.cfm:BTNSUBMIT"
"Information","XNIO-1 task-1","04/09/24","09:34:36","applicationName","/pathToApp/add.cfm:BTNSUBMIT"
"Information","XNIO-1 task-2","04/09/24","09:35:24","applicationName","/pathToApp/edit.cfm:DETAILID"
"Information","XNIO-1 task-2","04/09/24","09:35:24","applicationName","/pathToApp/edit.cfm:DETAILID"
"Information","XNIO-1 task-2","04/09/24","09:35:30","applicationName","/pathToApp/edit.cfm:BTNSUBMIT"
"Information","XNIO-1 task-2","04/09/24","09:35:49","applicationName","/pathToApp/received.cfm:BTNSUBMIT"
"Information","XNIO-1 task-3","04/09/24","09:41:06","applicationName","/pathToApp/note.cfm:BTNSUBMIT"

I’m going to implement this workflow and monitor the unscoped.log file daily to make corrections. Once some of the issues are identified in the unscoped.log file it becomes easier to use find/replace for common issues in the codebase.

For additional reading here is a good ColdFusion forum post: View unscoped variables in a log file

How to use the Microsoft JDBC Driver for SQL Server in ColdFusion

by

I recently had an issue where the datasources using the Microsoft SQL Server Driver in ColdFusion were failing. The error was:

java.sql.SQLException: Timed out trying to establish connection

There was no change with the database server. For some reason the driver was just not connecting. This led to an exploration of connecting using JDBC both with the Adobe jar included with ColdFusion and by downloading the Microsoft JDBC Driver for SQL Server.

Using the Microsoft JDBC Driver for SQL Server

First you must obtain the driver and make it available to ColdFusion:

To create a JDBC data source to connect to an MS SQL Server database in ColdFusion:

  • Login to CFADMIN
  • Navigate to the Data & Services tab in CFADMIN
  • Enter a Datasource Name: developmentServerJDBC
  • For Driver choose: Other
  • Click: Add

On the ensuing page enter the additional information (change to your info):

  • CF Data Source Name: developmentServerJDBC
  • JDBC URL: jdbc:sqlserver://developmentServer:databaseName=developmentDatabase;Port=1433;encrypt=false;
  • Driver Class: com.microsoft.sqlserver.jdbc.SQLServerDriver
  • Driver Name: mssql-jdbc
  • User name: developmentUser
  • Password: ************
  • Description (optional): Uses Microsoft jar file

Using ColdFusion’s Microsoft SQL Server Driver

To create a data source to connect to an MS SQL Server database in ColdFusion:

  • Login to CFADMIN
  • Navigate to the Data & Services tab in CFADMIN
  • Enter a Datasource Name: developmentServer
  • For Driver choose: Microsoft SQL Server
  • Click: Add

On the ensuing page enter the additional information (change to your info):

  • CF Data Source Name: developmentServer
  • Database: developmentDatabase
  • Server: developmentServer
  • Port 1433
  • User name: developmentUser
  • Password: ************
  • Description (optional): Uses ColdFusion's Microsoft SQL Server Driver

BONUS: Using ColdFusion’s Microsoft SQL Server Driver with JDBC

To create a JDBC data source to connect to an MS SQL Server database in ColdFusion:

  • Login to CFADMIN
  • Navigate to the Data & Services tab in CFADMIN
  • Enter a Datasource Name: developmentServerMicrosoftJDBC
  • For Driver choose: Other
  • Click: Add

On the ensuing page enter the additional information (change to your info):

  • CF Data Source Name: developmentServerMicrosoftJDBC
  • JDBC URL: jdbc:sqlserver://developmentServer:databaseName=developmentDatabase;Port=1433;encrypt=false;
  • Driver Class: macromedia.jdbc.MacromediaDriver
  • Driver Name: macromedia-jdbc
  • User name: developmentUser
  • Password: ************
  • Description (optional): Uses Adobe jar file

ACF Bug CF-4219847 (GENERATEDKEY and IDENTITYCOL are not returned)

by

ACF Bug CF-4219847 (GENERATEDKEY and IDENTITYCOL are not returned when performing an insert using MSSQL Symmetric Keys)

Filed as ACF bug CF-4219847.

This is not a bug in Lucee and functions as expected.

This demo illustrates that GENERATEDKEY and IDENTITYCOL are not returned when performing an insert using MSSQL Symmetric Keys.

ColdFusion 2023

ColdFusion 2023 IDENTITYCOL CF-4219847
ColdFusion 2023 IDENTITYCOL CF-4219847

ColdFusion 2021

ColdFusion 2021 IDENTITYCOL CF-4219847
ColdFusion 2021 IDENTITYCOL CF-4219847

Lucee 6

Lucee 6 IDENTITYCOL CF-4219847
Lucee 6 IDENTITYCOL CF-4219847

Code to Reproduce:

ACF Bug CF-4219348 (cfdirectory Filter: The importance of filter order)

by

UPDATE

This bug has been FIXED by Adobe in Build No: 2023.0.0.330651!

Filed as ACF bug CF-4219348.

This is not a bug in Lucee and functions as expected.

This demo illustrates the importance of filter order for cfdirectory in ACF.

A directory contains the following files:

  • this-is-a-doc.doc
  • this-is-a-docm.docm
  • this-is-a-docx.docx
  • this-is-a-xls.xls
  • this-is-a-xlsm.xlsm
  • this-is-a-xlsx.xlsx

The filter attribute of cfdirectory accepts a pipe delimited list. When a 3 digit file extension precedes a 4 digit file extension in the filter attribute of cfdirectory (and the extensions share the same first 3 characters) only files with the 3 digit extension are included. You could use an astericks () on the front and the back of the extension (.doc*) to retrieve both .doc and .docx, but this could also include additional files you don’t want to retrieve such as .docm files. The same is true for .xls, .xlsx, and .xlsm files.

Option 1: Filter (.doc|.docx|.xls|.xlsx): Returns 2 files: this-is-a-doc.doc, this-is-a-xls.xls

directory-filter-ACF-option-1

Option 2: Filter (.docx|.doc|.xlsx|.xls): Returns 4 files: this-is-a-doc.doc, this-is-a-docx.docx, this-is-a-xls.xls, this-is-a-xlsx.xlsx

directory-filter-ACF-option-2

Option 3: Filter(.doc|.xls): Returns 6 files: this-is-a-doc.doc, this-is-a-docm.docm, this-is-a-docx.docx, this-is-a-xls.xls, this-is-a-xlsm.xlsm, this-is-a-xlsx.xlsx

directory-filter-ACF-option-3

Code to Reproduce:

Using cfpm in CommandBox to List packages, Install a package, Export package list

by

Method 1

This example assumes you are running ColdFusion 2021 via CommandBox.

Launch CommandBox and run the following command(s):

> set CFPM_SERVER=YOUR_SERVER_NAME
> cfpm list
> cfpm install <cfpackagename>
> cfpm export path/to/packages.txt
> env clear CFPM_SERVER

Method 2

This example assumes you are NOT running ColdFusion via CommandBox. It assumes you are running a default installation of ColdFusion 2021 (Path is for Windows).

Launch CommandBox and run the following command(s):

> !C:\ColdFusion2021\cfusion\bin\cfpm.bat list
> !C:\ColdFusion2021\cfusion\bin\cfpm.bat install <cfpackagename>
> !C:\ColdFusion2021\cfusion\bin\cfpm.bat C:\path\to\packages.txt

Run CommandBox directly inside VSCode Terminal

by
Run CommandBox directly inside VSCode Terminal

Initially I looked at the CommandBox documentation for running it inside VSCode: https://commandbox.ortusbooks.com/ide-integrations/visual-studio-code. However, the Shell Launcher extension was deprecated in favor of Terminal Profiles in the Integrated Terminal (VSCode >= v1.55). See this article: https://code.visualstudio.com/updates/v1_55#_terminal-profiles.

Set up a Terminal Profile for CommandBox:

  1. Open VSCode Preferences > Settings
  2. Search for terminal.integrated.profiles.osx (Replace osx with windows or linux based on your os)
  3. Click “edit in settings.json”
  4. Add the following under terminal.integrated.profiles.osx
    "CommandBox": {
        "source": "path/to/box"
    }
  1. Close and save settings.json

Launch CommandBox from VSCode terminal

  1. Press Cmd + Shift + P or Ctrl + Shift + P to launch the Command Palette
  2. Begin typing Terminal
  3. When you see Create New Terminal (With Profile) press Enter
  4. Under Select the terminal profile to create you should see the CommandBox profile you created. Select it with the down arrow key and press Enter
  5. CommandBox should launch in the terminal window