Update: Alert screen reader users when content has been added (fixes #232)

[swashbuck]

🚧 Work in progress 🚧

Fixes #232

Update

• Alerts screen reader users when more content has been added to the page once the Trickle has been unlocked.
• Adds new string for the message at _globals._extensions._trickle.additionalContentLoaded in course.json

Fix

• Minor JS linting fixes. TrickleButtonModel.js only has linting fixes.
• Fix PR template typo

Testing

1. Using a screen reader, complete content that has been locked by Trickle.
2. Once unlocked, the screen reader should announce "Loading."

[oliverfoster]

Suggested change

	async announceContentLoaded() {
	const globals = Adapt.course.get('_globals');
	const message = globals?._extensions?._trickle?.additionalContentLoaded;
	if (!message) return;
	notify.create({ _type: 'a11y-push', body: message });
	// Allow time enough for the message to be read before focusing.
	// Rough estimate: 200ms per word + buffer
	const words = message.split(' ').length;
	const delay = (words * 200) + 300;
	return new Promise(resolve => setTimeout(resolve, delay));
	}
	async announceContentLoaded() {
	const globals = Adapt.course.get('_globals');
	const message = globals?._extensions?._trickle?.additionalContentLoaded;
	if (!message) return;
	await notify.read(message);
	}

Can you try the above with the following pr, please?

adaptlearning/adapt-contrib-core#673

[swashbuck]

Tested on a few question components. This seems to work if the user is required to click the Trickle button to continue. However, if not showing the Trickle button, it's hit or miss. Usually, the focus immediately goes to the Show Correct Answer button (or disabled Submit) and that is read out. So, we never hear "Loading." I'm using auto scroll in both cases.

[oliverfoster]

Well, that is irritating.

[oliverfoster]

Could you try it with all three of these prs please?

adaptlearning/adapt-contrib-core#673
adaptlearning/adapt-contrib-core#677
adaptlearning/adapt-contrib-core#679