Today I Learned

Non-removable MDM profiles cannot officially removed without doing a full system wipe. This is a problem when you restore a system from Time Machine after you enrolled it into the MDM, as the MDM will break, leaving you unable to re-enroll the machine.

Here's how to remove a non-removable MDM profile

1. Boot the Mac into Recovery Mode (hold down command+R during startup).
2. Go to the Utilities menu and open Terminal and type: csrutil disable. This will disable SIP (System Integrity Protection).
3. Reboot into the OS.
4. Open the integrated terminal and type:

cd /var/db/ConfigurationProfiles
rm -rf *
mkdir Settings
touch Settings/.profilesAreInstalled

5. Reboot.
6. Boot the Mac into Recovery Mode (hold down command+R during startup).
7. Go to the Utilities menu and open Terminal and type: csrutil enable. This will re-enable SIP.
8. Reboot into the OS.

The profile will be now removed and you will be able to re-enroll the Mac to your MDM.

Restoring from a Time Machine backup can create duplicate MDM VPN profiles.

To manually remove a profile on your macOS, follow these steps:

• Go to System Preferences and select Profiles.
• Delete the VPN profile, and enter the user password if requested.
• Then, go to Network Connections.
• If you see any connections which start with or include “VPN”, delete them.

Note

If the Button isn’t available,you have to use a terminal command to remove it. Open the integrated Terminal and type

networksetup -removenetworkservice "duplicateVPNProfile"

// www.codewars.com/kata/525f3eda17c7cd9f9e000b39

const curry = (operand, operator) => (!operator) ? operand : operator(operand);

const [zero, one, two, three, four, five, six, seven, eight, nine] =
  [0,1,2,3,4,5,6,7,8,9].map(operand => ((operator) => curry(operand, operator)));

const plus = (first) => (second) => second + first;
const minus = (first) => (second) => second - first;
const times = (first) => (second) => second * first;
const dividedBy = (first) => (second) => Math.floor(second / first);

In order to deploy Nuxt as a static website you need to:

1. Upgrade nuxt to 2.14.0
2. Set target: 'static' in your nuxt.config.js
3. Set fallback 404 page:generate: { fallback: '404.html' }
4. Run nuxt generate

You then need to tell Nginx to properly handle slashes for subpages:

    location /.
    {
        # Remove trailing slash and redirect it
        rewrite ^(.+)/+$ $1 permanent;
        
        # Redirect index.html
        rewrite ^(.+)/index.html$ $1 permanent;
        
        # Serve folder path via index.html
        try_files $uri $uri/index.html =404;
        
        # Serve a custom static error page
        error_page 404 /404.html;
    }

Midnight Commander opens up a new subshell at start which you can access with CTRL+O. Thing is this subshell will on certain shells like zsh make mc sluggish or freeze. A quick fix is to disable that subshell if you don't use it that often.

Just add this to your .zshrc file

alias mc="mc --nosubshell"

This will greatly improve mc's speed.

vuex-class' documentation doesn't come with clear steps on how one could call a getter with one or more arguments.

Here's how you do it:

  @workspaces.Getter
  protected workspace: WorkspaceType | null = null;
  
  public byId!: (id: WorkspaceId) => WorkspaceType;
  
  mounted(): void {
    this.workspace = this.byId({ id: this.activeWorkspaceId });
  }

Sometimes you need to follow an url trough multiple redirects. I've created a simple script you can alias into your .bashrc or .zshrc file and then just use it as a regular shell command:

Add this line to .zshrc or .bashrc

# Follow URL
alias checkurl='_checkurl() { curl -v -L $1 2>&1 | egrep "^(> Host:|> GET|> Code|< HTTP|\* SSL)"}; _checkurl'

Then you can use it like so:

checkurl google.com

it will output this:

> GET / HTTP/1.1
> Host: google.com
< HTTP/1.1 301 Moved Permanently
> GET / HTTP/1.1
> Host: www.google.com
< HTTP/1.1 200 OK

Really useful when debugging URLs.

Let's say you have a simple component in NuxtJS and VueJS, a static image for a blog post.

<template>
  <article class="post__image">
    <img class="image" src="~/assets/images/imageName.jpg" alt="post picture">
  </article>
</template>

Simple enough, right? But you don't want to have the same image for every blog post, so maybe you're trying to add it dynamically, getting the image name through a prop and using Vue's v-bind directive, like so:

<template>
  <article class="post__image">
    <img class="image" :src="`~/assets/images/${imageName}.jpg`" :alt="`${imageName} picture`">
  </article>
</template>

<script>
export default {
  name: 'PostImage',
  props: {
    imageName: String
  },
}
</script>

And then you notice that that doesn't work. But why? The vue syntax is correct, so what's the problem? Well, there's something else at play here.

Behind the scenes, webpack replaces the image path with a module request at build time. That's fine for static images, because their paths are known at build time, but for dynamic images it's a different story, as webpack can't know what their paths will evaluate to at run time, so that won't work.

The solution is to make a module request for the images, so that webpack can work its magic on them before loading them on the page. That's done by using require(...), with the correct image path.

So your images will have to be loaded like this:

<img 
    class="image" 
    :src="require(`~/assets/images/${this.imageName}.jpg`)" 
    :alt="`${imageName} picture`"
>

You could also clean that up a bit, and extract the require part into a computed property, for better readability:

<template>
  <article class="post__image">
    <img class="image" :src="imageSource" :alt="`${imageName} picture`">
  </article>
</template>

<script>
export default {
  name: 'PostWithImage',
  props: {
    imageName: String
  },
  computed: {
    imageSource() {
      return require(`~/assets/images/${this.imageName}.jpg`)
    },
  }
}
</script>

When you have to delete 100+ databases created by a botched deployment script you have a few options available:

1. Plain SQL

You'll have to run this query and then copy paste the result into a second query.

SELECT
	GROUP_CONCAT( CONCAT( 'DROP DATABASE `', SCHEMA_NAME, '`;' ) SEPARATOR ' ' ) AS DELETE_QUERY
FROM
	information_schema.SCHEMATA 
WHERE
	SCHEMA_NAME LIKE '{DBNAME}%'

2. Stored procedure

This allows you to create a stored procedure that will run your query in one go.

CREATE PROCEDURE clean () BEGIN

	SET @QUERY := (
		SELECT
			CONCAT( 'DROP DATABASE `', SCHEMA_NAME, '`;' ) 
		FROM
			`information_schema`.`SCHEMATA` 
		WHERE
			SCHEMA_NAME LIKE '{DBNAME}%' 
			LIMIT 1 
		);
	PREPARE stmt 
	FROM
		@QUERY;
	EXECUTE stmt;
	DEALLOCATE PREPARE stmt;
	
END;
CALL clean ();
DROP PROCEDURE clean;

While you can find detailed information in the official docs, I dare to spoil the fun for you:

1. All app variables are pulled in if they are prefixed with VUE_APP_.

Example: VUE_APP_API_URL.

You can now access the variables in your application like this: process.env.APP_URL.

2. All e2e variables are fetched if they are prefixed withCYPRESS_.

Example: CYPRESS_APP_URL.

You can now access the variables in your tests like this: Cypress.env('APP_URL').